使用angularjs级联下拉列表

时间:2016-10-04 09:13:09

标签: angularjs ionic-framework

我试图用另一个下拉列表将我的下拉框级联。所以第二个下拉列表将列出与第一个下拉框中所选项目相关的选项。我尝试了一个示例代码,然后删除 - 下来仍然是空的。

HTML:

<ion-view view-title="Car Type">
  <ion-content ng-app="CarWash" ng-contorller="carBrand">
   <h3> Add/Edit the Car Types </h3>
   Make:
        <select id="brand" ng-model="carBrand" ng-options="brand for (brand,item) in brandList">
          <option value=''>Select</option> 
        </select>

Type:
<select id="makeType" ng-model="brandType" ng-options="item for (brand,item) in brandlist">
  <option value=''>Select</option>
</select>
  </ion-content>
</ion-view>

控制器:

[angular.module('CarWash',\[\]).controller('carBrand',\['$scope',function($scope){

  $scope.brandList={'Benz':\['Regular','Truck'\]};
}\])]

链接1

1 个答案:

答案 0 :(得分:0)

你可以这样做,

<select name="client" ng-model="selectedRequest.parentType" ng-options="c.name.en for c in clients.brandList" required></select>
<select id="department" ng-model="selectedRequest.subType" ng-options="d.name.en for d in  selectedRequest.parentType.children">

<强> WORKING DEMO