javascript - Angular 选择选项被忽略

我有这个HTML：

<div class="form-group" ng-hide="controller.sports.loading">
    <label for="sport">Sport</label>
    <div class="input-group">
        <div class="input-group-addon">2</div>
        <select class="form-control" id="sport" ng-model="controller.team.data.sport">
            <option ng-repeat="sport in controller.sports.data" value="{{ sport.slug }}">
                {{ sport.title }}
            </option>
        </select>
    </div>
</div>

如您所见，模态边界是controller.team.data.sport。
如果我看一下，它包含一个运动弹头（例如网球）。
但是即使填充了此选项，也不会选择任何选项。我认为这可能是因为我的ng-repeat。我将值设置为sport.slug，但文本设置为sport.title。

我如何才能基于sport.slug获得所选选项？

这是模型的示例：

var team = {
    loading: false,
    data: {
        id: 1,
        name: 'Test',
        sport: 'tennis'
    }
};

最佳答案

我认为您应该使用ng-options

<select ng-model="controller.team.data.sport" ng-options="sport.slug as sport.title for sport in controller.sports.data">
</select>

编辑：我首先弄乱了sport.slug和sport.title的顺序