在 AngularJS 中为依赖下拉列表选择默认值



我需要为两个依赖下拉列表预先选择默认值。因此,在页面加载时,下拉列表应显示"自动"之类的内容,并选中了"两轮车"。 (并且不使用选定的属性,默认值必须通过$scope加载( 下面是工作下拉菜单的 Plunkr 链接。

http://plnkr.co/edit/3Xrpb4jBziWNZE9JVfts?p=preview

<select class="home_search_select" name="d1" ng-model="selectedd1" ng-options="cat.category_id as cat.category_name for cat  in categorydata track by cat.category_id" id="d1">
<option value="">Select Category</option>
</select>
<select class="home_search_select" name="d2" id="d2" ng-disabled="!selectedd1" ng-model="selectedd2" ng-options="subcat.ID as subcat.Name for subcat in ((categorydata|filter:{'category_id':selectedd1})[0].Subcategory) track by subcat.ID">
<option class="home_search_select" value="">Select Sub Category</option>
</select>

为 selected1 分配值,如下所示

$scope.selectedd1= {
"category_name": "Automotive",
"category_id": "1",
"Subcategory": [{
"Name": "Two Wheeler",
"ID": "1"
}, {
"Name": "Four Wheeler",
"ID": "2"
}, {
"Name": "Heavy Moving Vehicles",
"ID": "3"
}, {
"Name": "Automobile Related",
"ID": "4"
}]
};

修改第二个下拉列表中的 ng 选项

<select class="home_search_select" name="d2" id="d2"
ng-disabled="!selectedd1" ng-model="selectedd2" 
ng-options="subcat.ID as subcat.Name for subcat in selectedd1.Subcategory track by subcat.ID">
<option class="home_search_select" value="">Select Sub Category</option>
</select>

要侦听下拉列表中的更改,请使用ng-change指令

<select class="home_search_select" name="d1" 
ng-model="selectedd1" 
ng-change="homeChanged()"
ng-options="cat as cat.category_name for cat  in categorydata track by cat.category_id" id="d1">
<option ng-value="">Select Category</option>
</select>

注:ng-options更改为包含整个对象

更新的普伦克

最新更新