Question

我想知道如何在两个单独的下拉菜单中设置以下数据结构，其中第二个下拉菜单的内容取决于第一个菜单的选择。我的结构是：

{ level1a:{ Item1, Item2, Item3, Item4 }, level1b:{ Item5, Item6, Item7, Item8 } }

我想有以下程序：

如果我在第一个菜单“level1a”中选择，那么只有内容Item1，..，Item4应该出现在第二个下拉菜单中，相应地选择“level1b”。我想知道在前一个按钮上是否有“过滤器选项”。有人知道如何设置吗？任何帮助将不胜感激！

干杯，岸堤

Answer 1

使用ng-change，您可以在第一次选择完成后调用函数，然后在该函数中设置第二个选择的数据

在控制器中：

$scope.choice = ['a','b']

$scope.a = ['Item1','Item2','Item3','Item4'];
$scope.b = ['Item5','Item6','Item7','Item8'];

$scope.data = [];

  $scope.change = function(choice) {
    if (choice == 'a'){
      $scope.data = $scope.a;
    } else {
      $scope.data = $scope.b;
    }   
};

在HTML中：

<select ng-model="selection" ng-change="change(selection)">
  <option value="">---Please select---</option> 
  <option value="a">Option 1</option>
  <option value="b">Option 2</option>
</select><br>

<select ng-model="selectionTwo">
  <option ng-repeat="option in data" value="{{option}}">{{option}}</option>
</select>

我打算提供一名侦探，但无法保存，不知道为什么......我会编辑，如果它解决了

编辑：设法保存plunker

AngularJS 1.3 - 根据另一个下拉菜单中的选择显示下拉内容

1 个答案: