javascript - 启动值未设置选定值

Question

我制作了一个简单的 angular.js 示例来说明我的问题:example

我想将选择元素的起始值设置为特定值。

    <select name="i" id="i" ng-model="selectedItem">
        <option ng-repeat="i in items" value="{{i}}">{{i}}</option>
    </select>

选项和选择元素完美呈现。但是，就像在示例中一样，当我将 Controller 中的值设置为 6 时，页面上的选定值仍然是第一个元素。

scope.selectedItem = 6;

有 2 个简单的按钮可以更改所选的值。当您按下它们时，选择会毫无问题地改变。

编辑:我更新了 jsfiddle 并删除了未使用的代码并重命名了代码以使事情更加清晰

EDIT2:我错过了询问是否也可以修复第二个选择元素？不同的是这个数组包含的是对象而不是数字。

    <select name="o" id="o" ng-model="selectedItem">
        <option ng-repeat="o in objects" ng-value="{{o.ID}}">{{o.Text}}</option>
    </select>

Answer 1

您不应该使用 ngRepeat 来呈现选项元素，它不应该与 select 和 options 一起正常工作。使用 ngOptions这将按预期与 ngModel 一起工作:

<select name="i" id="i" 
        ng-model="selectedItem"
        ng-options="i for i in items">
</select>

对于将 ngModel 绑定(bind)到数组中对象的 ID 属性的第二个选择框，它将是:

<select name="o" id="o" 
        ng-model="selectedItem" 
        ng-options="obj.ID as obj.Text for obj in objects">
</select>

演示: http://jsfiddle.net/d3jf7ueq/9/