AnglularJS：基於第一個select-dropdown的選擇填充第二個select-dropdown

我有一組select-dropdown菜單，我試圖根據angularJS中第一個select-dropdown的選擇填充第二個select-dropdown。我不知道如何從這開始。AnglularJS：基於第一個select-dropdown的選擇填充第二個select-dropdown

我已準備好所有模型，但我正在與動態人口掙扎。

選擇1：

<select ng-model="selectedSource" ng-options="source.name for source in sourceList"> 
     <option value="">-- Select item --</option> 
    </select> 

$scope.sourceList= [ 
    { 
     "name":"Person", 
     "has": ["a","b","c"] 
    }, 
    { 
     "name":"Car", 
     "has": ["1","2","3"] 
    } 
];

什麼想實現：

當sourceList.name是Person填入第2個選擇，下拉與targerSet1

$scope.targerSet1= [ 
    { 
     "name":"King Julien" 
    } 
];

當sourceList.name我小號Car填入第二個選擇，下拉與targerSet2

$scope.targerSet2= [ 
    { 
     "name":"RoyalMobile" 
    } 
];

來源

2013-10-11 D' lo DeProjuicer

[可能的重複]（http://stackoverflow.com/questions/16191060/filter-dropdown-with-subcategories-in-angular）。 –

我知道它可能是重複的..但那個並沒有真正的幫助。 –

One controller，two models is the way to go https://stackoverflow.com/questions/18345020/populate-dropdown-2-based-on-dropdown-1-selection – AskPete

你可以使用綁定變量的第一選擇的第二個ng-options：

選擇

<select ng-model="selectedSource" ng-options="source.name for source in sourceList"> 
    <option value="">-- Select item --</option> 
</select> 

<select ng-model="selectedItem" ng-options="item.name for item in selectedSource.suboptions"> 
    <option value="">-- Select item --</option> 
</select>

控制器

$scope.sourceList = [ 
    { 
     name: "Person", 
     suboptions: [ 
      { name: "King Julien" } 
     ] 
    }, 
    { 
     name: "Car", 
     suboptions: [ 
      { name: "RoyalMobile" } 
     ] 
    } 
];

來源

2013-10-11 11:42:44 lort

AnglularJS：基於第一個select-dropdown的選擇填充第二個select-dropdown

回答

相關問題