我的 .html 页面中有一个下拉列表,
落下:
<select ng-model="blisterPackTemplateSelected" data-ng-options="blisterPackTemplate as blisterPackTemplate.name for blisterPackTemplate in blisterPackTemplates">
<option value="">Select Account</option>
</select>
我想在用户选择一个值时执行一个操作。所以在我的控制器中我做了:
控制器:
$scope.$watch('blisterPackTemplateSelected', function() {
alert('changed');
console.log($scope.blisterPackTemplateSelected);
});
但是更改下拉列表中的值不会触发代码:$scope.$watch('blisterPackTemplateSelected', function()
结果我尝试了另一种方法:ng_change = 'changedValue()'
在选择标签上
and
功能:
$scope.changedValue = function() {
console.log($scope.blisterPackTemplateSelected);
}
But the blisterPackTemplateSelected
存储到子作用域中。我读到父级无法访问子级范围。
当下拉列表中的选定值发生更改时,执行某些操作的正确/最佳方法是什么?如果是方法1,我的代码做错了什么?
正如 Artyom 所说,你需要使用ngChange并将 ngModel 对象作为参数传递给 ngChange 函数
Example:
<div ng-app="App" >
<div ng-controller="ctrl">
<select ng-model="blisterPackTemplateSelected" ng-change="changedValue(blisterPackTemplateSelected)"
data-ng-options="blisterPackTemplate as blisterPackTemplate.name for blisterPackTemplate in blisterPackTemplates">
<option value="">Select Account</option>
</select>
{{itemList}}
</div>
</div>
js:
function ctrl($scope) {
$scope.itemList = [];
$scope.blisterPackTemplates = [{id:1,name:"a"},{id:2,name:"b"},{id:3,name:"c"}];
$scope.changedValue = function(item) {
$scope.itemList.push(item.name);
}
}
实例:http://jsfiddle.net/choroshin/9w5XT/4/
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)