1. ホーム
  2. javascript

ng-optionsのキー・バリュー・ペア

2023-08-06 14:28:41

質問

私は 連想配列 をデータソースとして使用する必要があります。 select オプションのデータソースとして使用します。

このような配列を使用することは可能でしょうか?

{
    "key1": "val1",
    "key2": "val2",
    "key3": "val3",
    ...
}

と入力し、このようなものが得られます。

<select>
    <option value="key1">val1</option>
    <option value="key2">val2</option>
    <option value="key3">val3</option>
    ...
</select>

読む ドキュメント を読みましたが、これを実現する方法を理解することができません。

どのように解決するのですか?

使用 ng-option :

<select ng-model="blah" ng-options="key as value for (key , value) in data"></select>

または ng-repeat :

<select>
    <option ng-repeat="(key, value) in data" value="{{key}}">{{value}}</option>
</select>

コントローラのデータです。

$scope.data = {
    "key1": "val1",
    "key2": "val2",
    "key3": "val3",
    ...
};