我的 AngularJS 1.5 组件 booking-info 没有用预订数据填充我表单中的输入字段

Question

我在 bookingEdit 组件和包含表单输入字段的 bookingInfo 组件中有一个表单。 bookingInfo 组件内的字段未填充预订数据。我怎样才能使用我的预订信息和预订编辑组件来填充这些字段？

预订-edit.template.html

<form name="$ctrl.form" ng-submit="$ctrl.updateBooking()">
        <fieldset>
            <legend>Edit Booking</legend>
            <booking-info booking="$ctrl.booking"></booking-info>
            <button class="btn btn-success" type="submit">Save</button>
        </fieldset>
    </form>

预订-edit.component.js

'use strict';

angular.
    module('bookingEdit').
    component('bookingEdit', {
        templateUrl: 'booking-edit.template.html',
        controller: ['BookingService','$location',
            function (BookingService,$location) {
                let self = this;

                self.$routerOnActivate = function(next, previous) {
                     self.booking = BookingService.get({ id: next.params.id });
                };

                self.updateBooking = function () {
                    BookingService.update({ id: self.booking.bookingId }, self.booking)
                        .$promise
                        .then(
                            function () {
                                $location.path('/list');
                            },
                            function (error) {

                            }
                        );
                };
            }
        ]
    });

预订-info.component.js

angular.module('app').
    component('bookingInfo', {
       templateUrl: 'booking-details.html',

       bindings: { 
          booking:'<'
         },
       controller: function(){
         let self = this;


       }
    });

预订-details.html

<div class="form-group">
    <label for="contactName">Contact Name</label>
    <input required type="text" class="form-control" ng-model="booking.contactName">
</div>
<div class="form-group">
    <label for="contactNumber">Contact Number</label>
    <input required type="tel" class="form-control" ng-model="booking.contactNumber">
</div>

Answer 1

您似乎忘记了 booking-details.html

中的 $ctrl

<div class="form-group">
  <label for="contactName">Contact Name</label>
  <input required type="text" class="form-control" ng-model="$ctrl.booking.contactName">
</div>
<div class="form-group">
  <label for="contactNumber">Contact Number</label>
  <input required type="tel" class="form-control" ng-model="$ctrl.booking.contactNumber">
</div>