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

我在bookingEdit组件中有一个表单,bookingInfo组件包含表单的输入字段。bookingInfo组件内的字段未填充预订数据。如何使用我的预订信息和预订编辑组件填充这些字段?

booking-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>

booking-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) {

                            }
                        );
                };
            }
        ]
    });

booking-info.component.js

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

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


       }
    });

<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>