Angular Strap數據分步設置動態

我試圖設置data-minute-step={{somevalue}}，但是如果我更改該值，它不會更新選擇器。我能做點什麼嗎？
Angular Strap數據分步設置動態

例子：

<input type="number" ng-model="stepSize">  
<input bs-timepicker data-minute-step="{{stepSize}}">

這是我有：

<input id="timetable.amountPerLeson" 
     class="form-control" 
     type="number" 
     step="15" 
     placeholder="45 min" 
     ng-model="durationStep"> 

<input id="timetable.start" 
     class="form-control" 
     type="text" 
     placeholder="date" 
     ng-model="slot.startHour" 
     bs-timepicker 
     data-time-format="HH:mm" 
     data-length="1" 
     data-minute-step="{{durationStep}}" 
     data-arrow-behavior="picker" 
     ng-show="slot.name === 'Hours'" >

來源

2016-07-25 Emanuel

我再次刪除了我的答案，但是如果只是在視圖中的任何位置打印「{{stepSize}}」（而不是作爲屬性）並更新輸入 - 是否也在視圖中呈現？ –

是的，它呈現。我的意思是它在DOM中得到更新。 – Emanuel

我接過來一看就source code，它似乎並沒有看屬性上的變化 - 他們正在評估只有一次，所以這就是爲什麼通過輸入dons't工作chaning data-minute-step。

解決方法我可以建議很給力呈現timepicker元素，在更新分鐘步驟：

<input id="timetable.amountPerLeson" class="form-control" type="number" step="15" placeholder="45 min" 
     ng-model="durationStep" ng-change="minutesUpdated()"> 

<input id="timetable.start" class="form-control" type="text" placeholder="date" 
     ng-model="slot.startHour" 
     bs-timepicker data-time-format="HH:mm" data-length="1" ng-attr-data-minute-step="{{durationStep}}" 
     data-arrow-behavior="picker" ng-show="slot.name === 'Hours'" ng-if="!renderTimePicker">

添加渲染功能控制器（請確保你注入$timeout）：

$scope.minutesUpdated = function() { 
    $scope.renderTimePicker = true; 
    $timeout(function() { 
     $scope.renderTimePicker = false; 
    }); 
};

更改視圖中的分鐘步驟將觸發$scope.minutesUpdated()函數，它將從視圖中刪除timepicker（因爲我向元素添加了ng-if="!renderTimePicker"），並在視圖呈現後再次將其返回（通過在$timeout內重置$scope.renderTimePicker = false;）。

請注意，我將data-minute-step更改爲ng-attr-data-minute-step，因爲我認爲它會使其工作。

來源

2016-07-25 12:34:37

Angular Strap數據分步設置動態

回答

相關問題