Chr*_*ris 3 javascript angularjs
当用户更改菜单中选定的项目时,可以轻松使用Angular数据绑定强制更改JavaScript属性.但是,当用于生成菜单的模型发生更改时,我无法弄清楚如何强制更改数据绑定属性.
这个小提琴演示了这种行为:http: //jsfiddle.net/2pHGX/.通过单击changeOptions更改模型会导致选择选项正确更改.但是数据绑定属性不会立即更改,只会在用户选择其他菜单选项时更改.
<body ng-app ng-controller="bodyCtrl">
<select ng-model="selection" ng-options="option for option in options">
</select>
<button ng-click="changeOptions()">changeOptions</button>
<br>
selection: {{selection}}
</body>
function bodyCtrl($scope) {
$scope.options = [10, 20, 30];
$scope.changeOptions = function() {
$scope.options = [11, 22, 33];
};
}
我希望数据绑定属性在所选选项因任何原因发生更改时更新,因为用户选择了不同的选项,或者因为模型以及因此更改了选项.我可以使用它$watch,但我无法理解为什么单独的数据绑定是不够的.使用Angular实现此目的的最佳方法是什么？我是否误解了数据绑定的基本内容？
如果直接将ng-model绑定到范围变量,则不会更新范围变量.
<select ng-model="selection" ng-options="option for option in options">
相反,在范围中定义视图模型并将ng-model绑定到视图模型,将更新视图模型字段.
<select ng-model="viewmodel.selection" ng-options="option for option in options">
在你的控制器中,你应该这样做:
app.controller('SomeCtrl', ['$scope'
function($scope)
{
$scope.viewmodel = {};
});
| 归档时间： |
|
| 查看次数： |
13801 次 |
| 最近记录： |