ui.bootstrap.datepicker是开放的，不能在模态中工作。

Question

我使用的引导UI数据报考指令，我尝试有一个数据报关按钮，打开数据报警器弹出，就像在最初的例子，但它不工作在一个模式窗口。

请参阅柱塞

我做错了什么？

Answer 1

我不得不暂停一下才能让它发挥作用：

function toggleStart($event) {
    $event.preventDefault();
    $event.stopPropagation();
    $timeout(function () {
        vm.isStartOpen = !vm.isStartOpen;
    });
}

我的模板如下所示：

<input type="text" class="form-control"
        datepicker-popup ng-model="vm.startDate"
        is-open="vm.isStartOpen" />
<span class="input-group-btn">
    <button type="button" class="btn btn-default"
            ng-click="vm.toggleStart($event)">
        <i class="glyphicon glyphicon-calendar"></i>
    </button>
</span>

Answer 2

datepicker指令创建自己的作用域，这是不可访问的outside.So，可以解决这个问题。

$parent.isopen 

或者使用对象属性名来避免原型继承，如

$scope.config.isopen=true;

ng-model="config.isopen"而不是ng-model="isopen"。

Answer 3

您还可以这样按图标初始化日期选择器。

HTML

<p class="input-group" ng-disabled="invoiceDateDisable">
    <input is-open="opened" type="text" datepicker-popup="M/d/yyyy" ng-model="Date" datepicker-options="dateOptions" />
    <span class="input-group-btn">
        <button type="button" class="btn btn-default" ng-click="open()"><i class="glyphicon glyphicon-calendar"></i></button>
    </span>
</p>

JavaScript

$scope.open = function () {
    $scope.opened = true;
};