带有动态 minMode 的 uib-datepicker-popup

Question

如何动态设置 Angular Bootstrap Datepicker 的 minMode？

我得到它的唯一方法是：

<input type="text" ng-model="myDate"
       uib-datepicker-popup="{{datepickerFormat}}"
       datepicker-options="{'minMode': minMode}"/>

在控制器中

...
$scope.minMode='day';

它运行良好，但是当 minMode 更改并且日期选择器重新打开时，我在浏览器控制台中出现 $compile:nonassignNon-Assignable 错误。所以我想做类似的事情：

<input type="text" ng-model="myDate"
       uib-datepicker-popup="{{datepickerFormat}}"
       min-mode="minMode"/>

但不幸的是，它不再起作用了。

Angular version: 1.5.9
Bootstrap version: 3.3.7
angular-bootstrap version: 1.2.5

See in Plunker

Answer 1

您没有正确放置 minMode 值

因为您在日期选择器中放置了选项，随后使用按钮更改了这些选项，所以您需要在控制器中定义 options 对象并在两个地方引用它。

<div class="input-group">
    <input type="text"
        ng-model="myDate"
        is-open="showDatePicker"
        uib-datepicker-popup="mm-dd-yyyy"
        datepicker-options="options"/>
</div>

在控制器中

$scope.options = {'showWeeks': false, 'minMode': 'month'};

现在您可以使用 ng-click 表达式

来更改 minMode 属性

<button ng-click="options.minMode = 'day'" class="btn">Day</button>
<button ng-click="options.minMode = 'month'" class="btn" >Month</button>

Updated plunk

带有动态 minMode 的 uib-datepicker-popup

uib-datepicker-popup with dynamic minMode

javascript

datepicker

angularjs

angular-ui-bootstrap