私のアプリケーションでは、複数のドロップダウンメニューから選択するオプションがあり、前の2つのメニューからの選択に応じて3番目のメニューが動的になります。Angularのng-repeatを使用したダイナミックドロップダウン
私は私のコントローラでこの
// First dropdown menu
<select ng-model="letter" class = "form-control">
<option ng-repeat= "letter in letters" value = "letter">{{letter}}</option>
</select>
<br>
// second dropdown menu
<select ng-model="number" class = "form-control">
<option ng-repeat = "number in numbers" value = "number">{{number}}</option>
</select>
<br>
// third dropdown menu
<select ng-model="color" class="form-control">
<option ng-repeat="A1_color in A1_colors" ng-if= "letter = A & number = 1" value="{{A1_color}}">{{A1_color}}</option>
</select>
...
<select ng-model="color" class="form-control">
<option ng-repeat="B2_color in B2_colors" ng-if= "letter = B & number = 2" value="{{B2_color}}">{{B2_color}}</option>
</select>
のような条件を設定するために、ユーザが選択した場合、私は「だから、この
$scope.letters = {'A', 'B'};
$scope.numbers = {'1', '2'};
$scope.A1_colors = {'red', 'pink'};
$scope.A2_colors = {'blue', 'black'};
$scope.B1_colors = {'yellow', 'orange'};
$scope.B2_colors = {'white', 'black'};
のようなリストを持っているngのリピートとあればNGを、使用していますA '、2番目のメニューから' 2 'を選択すると、3番目のメニューで' A2_colors 'のオプションが表示されます。これを行う正しい方法は何ですか?
はあなたに感謝します!はい、それは、さまざまな色と数字と文字の巨大なリストの小さな例です。このアプローチの私の唯一の懸念は、var colors []の中で乱雑に見えるということです。私はどれくらい多くのアイテムを持っているのですか? –
[]内にタプルがあれば、どうすればこのようにするのか説明できますか? ['red': 'dark'、 'pink': 'light']? –
私はあなたのアプローチを実装しましたが、オプションは表示されません –