AngularJS 下拉值动态变化 [英] AngularJS Drop down values change Dynamically
本文介绍了AngularJS 下拉值动态变化的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我使用 AngularJS 创建了两个下拉菜单,并通过控制器在其中添加了数据.当第一个下拉列表发生变化时,我想更改第二个下拉列表的值.
我创建了示例,但是当我更改第一个下拉列表的值时;第二个下拉值不变.
解决方案
更新的 HTML:
<ul data-role="listview" data-inset="true" ><li><select id="exerciseSuperCategory" data-role="listview" ng-options="catagory as catagory.text for catagories.cast " ng-model="itemsuper" ng-change="changeData()"></选择><ul data-role="listview" data-inset="true"><li><select data-role="listview" ng-options="type as type.text for type in types.cast " ng-model="item1" ng-change="update()"></选择>更新控制器:
myApp.controller('exerciseTypeCtrl',function($scope,indoors,outdoors,setNulls, catagories){$scope.catagories = 类别;$scope.types = setNulls;$scope.changeData = function() {//console.log($scope.itemsuper);if($scope.itemsuper.text == "室内") {$scope.types = 室内;} else if($scope.itemsuper.text == "户外") {$scope.types = 户外;} 别的 {$scope.types = setNulls;}}});
I have created two drop downs using AngularJS and appended data in them through the controllers. I want to change the second drop down values when a change occurs in first drop down.
I create the example, but when I change value of the first drop down; the second drop down values do not change.
解决方案 Updated HTML:
<div ng-controller="exerciseTypeCtrl">
<ul data-role="listview" data-inset="true" >
<li>
<select id="exerciseSuperCategory" data-role="listview" ng-options="catagory as catagory.text for catagory in catagories.cast " ng-model="itemsuper" ng-change="changeData()">
</select>
</li>
</ul>
<ul data-role="listview" data-inset="true">
<li>
<select data-role="listview" ng-options="type as type.text for type in types.cast " ng-model="item1" ng-change="update()">
</select>
</li>
</ul>
Updated Controller:
myApp.controller('exerciseTypeCtrl',function($scope,indoors,outdoors,setNulls, catagories){
$scope.catagories = catagories;
$scope.types = setNulls;
$scope.changeData = function() {
//console.log($scope.itemsuper);
if($scope.itemsuper.text == "Indoor") {
$scope.types = indoors;
} else if($scope.itemsuper.text == "Outdoor") {
$scope.types = outdoors;
} else {
$scope.types = setNulls;
}
}
});
这篇关于AngularJS 下拉值动态变化的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文