设置此选项的最简单方法是简单地使次要集合依赖于第一个集合的选择.您可以通过多种方式执行此操作,但只需更换绑定的集合即可.
一个简单的例子：
- (function() {
- 'use strict';
- function InputController() {
- var secondary = {
- A: [1,2,3],B: [3,4,5]
- },vm = this;
- vm.primary = ['A','B'];
- vm.selectedPrimary = vm.primary[0];
- vm.onPrimaryChange = function() {
- vm.secondary = secondary[vm.selectedPrimary];
- };
- }
- angular.module('inputs',[])
- .controller('InputCtrl',InputController);
- }());
- <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet" />
- <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.12/angular.min.js"></script>
- <div class="container" ng-app="inputs" ng-controller="InputCtrl as ctrl">
- <div class="row">
- <div class="col-xs-6">
- <h3>Primary</h3>
- <select class="form-control" ng-model="ctrl.selectedPrimary" ng-options="item for item in ctrl.primary" ng-change="ctrl.onPrimaryChange()"></select>
- </div>
- <div class="col-xs-6">
- <h3>Secondary</h3>
- <select class="form-control" ng-model="ctrl.selectedSecondary" ng-options="item for item in ctrl.secondary"></select>
- </div>
- </div>
- </div>
