md-switchをmd-selectに変換する

Question

AngularJsを使用し、colorとsizeオプションを2つのドロップダウン（各カテゴリに1つ）に変換する方法を理解しようとしています。

私は、選択ボックスのオプションとともにドロップダウンを正常に追加するコードを試しましたが、オプションの1つをクリックすると選択されません。

<md-select ng-model="filter[cat][value]" placeholder="val" multiple> 
    <md-option ng-repeat="value in getItems(cat, data)" ng-value="{{value}}" ng-init="filter[cat]={}"> 
    {{value}} 
    </md-option> 
</md-select> 

デモ：https://codepen.io/mikelkel/pen/rwQKRm（。コードの上に、このデモから削除されていた）

Answer 1

いくつかの問題があります：それは=「true」の倍数にする必要があるので、ドキュメントによると

、複数のブール値です。

value（ng-model）は、md-optionにしか存在しないため、その範囲には存在しません。したがって、filter[cat][value]は実行できません。 md-selectのドキュメントを見ると、複数のモデルを使用している場合は配列であることがわかります。したがって、ng-modelを単にfilter[cat]に設定すると、その値は["red","yellow"]のようになります。

filterByPropertiesMatchingANDを変更して、同様のプロパティとの文字列一致ができるようにすることができます（シャツの色が赤で、filter.color配列に赤が含まれている場合はtrueを返します）。

私はあなたのcodepen（https://codepen.io/czema/pen/KqbpPE）をフォークし、次のように変更作られた：私はそれを残したが、私は、配列ではなくオブジェクトにfilter[cat]を初期化時にng-initが眉をひそめているにもかかわらず

を。

md-itemを削除しました。

は、私はあなたのfilterByPropertiesMatchingAND機能を変更JavaScriptでfilter[cat]と

multiple="true"にng-modelを設定します。現在、$scope.filterには、（カラー名とブール値を持つオブジェクトではなく）各プロパティの配列が含まれています。私はnoSubFilter機能を落としました。

Answer 2

使用ng-optionsselectではなくng-repeatでoptionタグに。 ng-optionsの構文は少し奇妙ですが、あなたのケースでは、このようなものになるだろう：ng-options="value for value in getItems(cat, data)"

は限り上記のあなたの試みがうまくいかない理由としてngOption https://docs.angularjs.org/api/ng/directive/ngOptions

のマニュアルを読んで、おそらく何かを持っていますng-initと一緒に使用します。このオプションはオプションごとに実行されており、おそらく既存のデータは消去されています。 ng-initは使用しないでください。