Question

我有这个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。如果我看一下，它包含一个运动slug（例如网球）。但即使填充了这个，也没有选择的选项。我想这可能是因为我的 ng-repeat 。我将我的值设置为 sport.slug ，但文本设置为 sport.title 。

如何让我选择的选项基于sport.slug？

以下是该模型的示例：

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

Answer 1

我认为你应该使用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的顺序

Answer 2

试试这个 -

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

尝试尽可能多地使用角度功能。

角度选定的选项被忽略

2 个答案: