关闭。这个问题需要debugging details .它目前不接受答案。
想改进这个问题?将问题更新为 on-topic对于堆栈溢出。
7年前关闭。
Improve this question
我有一个表单,我想有两个选择框,以便在其中一个中,某些选项将根据另一个选择框的当前值显示/隐藏。
例如
Select box X Options :
A
B
Select box Y Options :
1 // shows only when A is selected in Select box X
2 // A
3 // A
4 // shows only when B is selected in Select box X
5 // B
6 // B
请帮忙。
最佳答案
设置它的最简单方法是简单地使辅助集合依赖于第一个集合的选择。您可以通过多种方式执行此操作,但最好的选择是简单地换出绑定(bind)的集合。
一个简单的例子:
(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>
关于angularjs - 如何在 Angular js中显示依赖选择框选项,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28345392/