AngularJS の ng-options ディレクティブを使用すると、開発者は
値の設定メカニズムを理解するために、ngOptions の構文を詳しく調べてみましょう。次のいずれかの形式の式を受け取ります:
配列の場合:
label for value in array
オブジェクトの場合:
label for (key, value) in object
次の配列の例を考えてみましょう:
array = [{ "value": 1, "text": "1st" }, { "value": 2, "text": "2nd" }];ng-options を使用してオプションを埋めるには、次のように記述できます:
<select ng-options="obj.text as obj.value for obj in array"></select>
この場合、obj.value によって選択された値が決まります。
更新: 値式による追跡
最近の AngularJS 更新により、track by を使用して value 属性の値を明示的に指定できるようになりました。式:
<select ng-options="obj.text for obj in array track by obj.value"></select>
構文の覚え方
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 オブジェクトの場合、構文は同様で、(キー、値) ペアを使用します。
for (key, value) in object
以上がAngularJS の ng-options で value 属性を設定するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
