javascript - 如何为Angularjs选择动态设置值?
问题描述
在 Angularjs 中,我尝试从程序中动态设置选项。但是,我无法设置。
请支持。
验证评论的参考链接以获取更多详细信息。
提前致谢!
<div ng-app="myApp">
<div ng-controller="AppCtrl">
"AngularJS select example"
<br />
<br />
<select ng-model="mail_notification" ng-change="plotRulegraph()">
<option ng-selected="{{ option.key == mail_notification }}"
ng-repeat="option in mail_notifications"
value="{{option.key}}">
{{option.value}}
</option>
</select>
<br />
</div>
</div>
app.controller('AppCtrl', function($scope){
$scope.mail_notifications = [
{
"key": 0,
"value": "For any event on all my projects"
},
{
"key":1,
"value": "For any event on the selected projects only..."
},
{
"key": 2,
"value": "Only for things I watch or I'm involved in"
},
{
"key": 3,
"value": "Only for things I am assigned to"
}
];
$scope.mail_notification = 3;
$scope.plotRulegraph = function() {
$scope.mail_notification=2;
}
});
解决方案
不要ng-selected
与ng-model
.
当值是字符串以外的类型时,使用ng-value
指令:
<div ng-app="myApp">
<div ng-controller="AppCtrl">
"AngularJS select example"
<br />
<br />
<select ng-model="mail_notification" ng-change="plotRulegraph()">
<option ̶n̶g̶-̶s̶e̶l̶e̶c̶t̶e̶d̶=̶"̶{̶{̶ ̶o̶p̶t̶i̶o̶n̶.̶k̶e̶y̶ ̶=̶=̶ ̶m̶a̶i̶l̶_̶n̶o̶t̶i̶f̶i̶c̶a̶t̶i̶o̶n̶ ̶}̶}̶"
ng-repeat="option in mail_notifications"
̶v̶a̶l̶u̶e̶=̶"̶{̶{̶o̶p̶t̶i̶o̶n̶.̶k̶e̶y̶}̶}̶"̶
ng-value="option.key">
{{option.value}}
</option>
</select>
<br />
</div>
</div>
使用双花括号插值{{ }}
,将值转换为字符串。该<select>
指令在比较值时使用严格相等。数字键不等于字符串键。该ng-value
指令保留正确的类型。
从文档:
注意:
ngSelected
不与<select>
andngModel
指令交互,它只在元素上设置 selected 属性。如果您在ngModel
上使用,则<select>
不应ngSelected
在选项上使用,因为ngModel
将设置<select>
值和选定的选项。
有关详细信息,请参阅
更新
该示例需要 AngularJS V1.5 或更高版本。
PLNKR 上的演示。
推荐阅读
- python - 基于 IQR 按组去除异常值
- javascript - 项目不可拖动
- python - 错误:找不到 Requirement.parse('rest_framework>=3.6.3') 的合适分布
- spring-boot - 找不到 oneToOne 关系的实体
- javascript - 在本机反应中使用 Scrollview 和 KeyboardAvoidingView 阻止文本输入的键盘
- ios - 设备上的 iOS 单元测试无法启动 - HealthKit 权利错误
- r - 如何在 R 中进行一种热编码
- scala - 为什么 scala.collection.immutable.List[Object] 不是 GenTraversableOnce[?]
- android - 如何克服android sqlite where 子句问题?
- tensorflow - 如何更改 tensorflow.layers.dense() 层的输入?