Angular-ui bootstrap 日期选择器不会打开两次

Question

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

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

我肯定在这里遗漏了一些东西，但经过数小时的努力后我放弃了。

你能帮忙吗？

日期选择器的 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>

控制器中的 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>

Angular-ui bootstrap 日期选择器不会打开两次

Angular-ui bootstrap datepicker won't openup twice

twitter-bootstrap

angularjs

angular-ui-bootstrap