Question

我目前有以下选择：

<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中是否可行？

Answer 1

您正在使用event.event_id，因此AngularJS的行为没有任何问题。您只需将label放在ng-options的{{1}}中（参见documentation）。

但是，你需要先调用一个函数才能获得正确的标签，因为你想要的东西非常复杂。

<select>

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

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

jsFiddle

在select中使用object属性

1 个答案: