所以,我尝试用普通的JS做的相当简单,但我使用的是AngularJS,我想知道如何在框架中以最好的方式完成它。我想要更新多选框中的选定选项。我不想添加或删除任何选项。下面是我的HTML的样子:
<select multiple>
<option value="1">Blue</option>
<option value="2">Green</option>
<option value="3">Yellow</option>
<option value="4">Red</option>
</select>
使用以下数组,我想以编程方式从该列表中选择/取消选择选项:
[{id:1, name:"Blue"},{id:4, name:"Red"}]
当我在作用域中设置此数组时,我希望选择框取消选择除Blue或Red以外的任何内容,并选择Blue和Red。我在Google组上看到的标准答案是使用ng-repeat。但是,我不能每次都重新创建列表,因为所选值的列表是不完整的。据我所知,AngularJS没有这样的机制,我不知道如何在不使用jQuery的情况下做到这一点。
发布于 2013-09-12 05:39:53
ngModel太棒了!如果将索引指定为模型selectedValues
<select multiple ng-model="selectedValues">
从$watch
中的列表(selected
)构建
$scope.$watch('selected', function(nowSelected){
// reset to nothing, could use `splice` to preserve non-angular references
$scope.selectedValues = [];
if( ! nowSelected ){
// sometimes selected is null or undefined
return;
}
// here's the magic
angular.forEach(nowSelected, function(val){
$scope.selectedValues.push( val.id.toString() );
});
});
ngModel将自动为您选择它们。
请注意,此数据绑定是单向的(selected
到UI)。如果您想要使用<select>
UI来构建列表,我建议您重构数据(或者使用另一个$watch
,但这样做的代价可能会很高)。
是的,selectedValues
需要包含字符串,而不是数字。(至少对我来说是这样的:)
https://stackoverflow.com/questions/18751129
复制相似问题