AngularJS 1.3 - 顯示下拉菜單的內容取決於另一個下拉菜單中的選擇

Question

我在想如何在兩個單獨的下拉菜單中設置下列數據結構，其中第二個下拉菜單的內容取決於在第一個菜單的選擇上。 我的結構是：

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

我想有以下步驟：

如果我在第一個菜單「level1a」，則只有內容項目1選擇，..，項目4應該出現在第二個下拉菜單，相應地用於選擇「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; 
    } 
}; 

IN 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，但無法拯救它，不知道爲什麼。我將編輯它是否解決

編輯：設法挽救plunker