AngularJS の ng-options の値の設定

AngularJS の ng-options ディレクティブを使用すると、開発者は タグのオプションを設定できます。よくある質問の 1 つは、各オプションの value 属性を設定する方法です。

値設定メカニズムを理解するために、ngOptions の構文を詳しく調べてみましょう。次の形式のいずれかの式を取ります:

配列の場合:

label for value in array

オブジェクトの場合:

label for (key, value) in object

次の例を考えてみましょう配列:

array = [{ "value": 1, "text": "1st" }, { "value": 2, "text": "2nd" }];

ng-options を使用してオプションを入力するには、次のように記述できます:

この場合、obj.value によって各オプションの選択された値が決定されます。

更新: 値式による追跡

最近の AngularJS の更新により、式によるトラックを使用して value 属性の値を明示的に指定できるようになりました:

構文の覚え方

ngOptions の構文は難しい場合があります思い出すために。わかりやすい例えとしては、これを Python のリスト内包表記の拡張バージョンと考えるとよいでしょう:

[x**2 for x in [1, 2, 3, 4, 5]]

ただし, ng-options では、as キーワード:

person.id as person.name for person in people

JavaScript オブジェクトの場合、構文は似ており、(key, value) ペアを使用します:

for (key, value) in object