1

現在、次の選択があります。

<select ng-model="current_event"
        ng-options="event.event_id for event in current_level.events.event"
        ng-change="currentEventChanged()">
</select>

current_level.events.event次のようなオブジェクトの配列です。

[
    {
        "event_id": 0,
        "event_type": {
            "collision": {
                "object_id1": 0,
                "object_id2": 1,
                "allow_overlap": "no"
            }
        }
    },
    {
        "event_id": 1,
        "event_type": {
            "player_input": {
                "object_id": 0,
                "level_id": 0,
                "allow_overlap": "no"
            }
        }
    }
]

選択は完全に機能しますが、各オプションのテキストはevent_id、たとえば「0」または「1」です。アイテムのテキストを実際にevent_type（アンダースコアをスペースに変換して）、たとえば「衝突」や「プレイヤー入力」にしたい。これはAngularJSで可能ですか?

4

1 に答える 1

3

を使用してevent.event_idいるので、AngularJS の動作に問題はありません。label単に権利をng-optionsofに入れる必要があります (ドキュメント<select>を参照してください)。

ただし、必要なものはかなり複雑であるため、正しいラベルを取得するには、事前に関数を呼び出す必要があります。

$scope.getLabel = function (eventType)
{
    var firstKey = null;
    angular.forEach(eventType, function (value, key)
    {
        if (firstKey === null)
        {
            firstKey = key;
        }
    });

    return firstKey.replace('_', ' ', 'g');
};

<select
    ng-model="current_event"
    ng-options="event.event_id as getLabel(event.event_type) for event in current_level.events.event"
    ng-change="currentEventChanged()"
>
</select>

jsFiddle

于 2013-09-22T09:32:35.087 に答える