angularjs - Angular-ui bootstrap datepicker不会打开两次

Question

我正在使用 angular-ui bootstrap datepicker 组件。在一个有两个日期字段的 View 中，日期选择器会打开，关闭后，单击“确定”后会再次打开。

在另一个页面上，打开和关闭后，日期选择器不再打开。

我肯定在这里遗漏了一些东西，但经过几个小时的尝试后我放弃了。

你能帮忙吗？

日期选择器的 HTML 部分如下所示:

<div class="input-group">
                        <input type="text" class="input-sm-7" datepicker-popup="dd/MM/yyyy" is-open="opened"
                               datepicker-options="dateOptions" ng-model="singleDate"
                               close-text="Close" />
                        <button type="button" class="btn btn-default" ng-click="open($event)"><i
                                class="fa fa-calendar"></i>
                        </button>
                    </div>

Controller 中的 JS 代码如下所示:

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

        $scope.open = function($event) {
            $event.preventDefault();
            $event.stopPropagation();

            $scope.opened = true;
        };

Answer 1

这是一个已知问题，并且有一个解决方案。试试这个。

$scope.datePicker = {};
$scope.open = function ($event) {
  $event.preventDefault();
  $event.stopPropagation();
  $scope.datePicker.opened = true;
};

Html 的更改

<div class="input-group">
  <input type="text" class="input-sm-7" datepicker-popup="dd/MM/yyyy" is-open="datePicker.opened"
                               datepicker-options="dateOptions" ng-model="singleDate"
                               close-text="Close" />
  <button type="button" class="btn btn-default" ng-click="open($event)"><i
                                class="fa fa-calendar"></i>
                        </button>
</div>