单击日历按钮在Angular UI Bootstrap中不起作用

Question

单击日历按钮不会打开日期选择器。 我的代码如下：

<p class="input-group" style="width: 200px;">
<input type="text" class="form-control" datepicker-popup="{{format}}" ng-model="dt" is-open="opened" datepicker-options="dateOptions" date-disabled="disabled(date, mode)" ng-required="true" show-weeks="false" max="maxDate" show-button-bar="false"/>
<span class="input-group-btn">
<button type="button" class="btn btn-default" ng-click="openDatePicker($event)"><i class="fa fa-calendar"></i></button>
</span>
</p>

JS文件：

        $scope.openDatePicker = function ($event) {
            console.log("opening datepicker: ", $scope.opened);
            $event.preventDefault();
            $event.stopPropagation();

            $scope.opened = true;
            console.log("is datepicker opened: ", $scope.opened);
        };

      $scope.dt = new Date();

      $scope.dateOptions = {
        formatYear: 'yy',
        startingDay: 1
      };

      $scope.maxDate = new Date();
      $scope.formats = ['dd-MMMM-yyyy', 'yyyy/MM/dd', 'dd.MM.yyyy',
        'shortDate'
      ];
      $scope.format = $scope.formats[0];

单击日历按钮时，日期选择器未打开。 提前致谢