AngularJS。当 select 具有 ng-model 属性时，ng-selected 不工作

Question

我正在尝试在我的 option 元素中设置 ng-selected，selected 属性设置为 true，但未选择 option，当我从 select 中删除 ng-model 全部开始工作。

问题：如何在使用模型时选择option？

这里是 my plunker（selected 在这里不起作用）

我的代码：

var app = angular.module("plunker", []);

app.controller("TestController", ["$scope", function($scope) {
  $scope.test = 1;
  $scope.array = [
        {"id": 1, "name": "first"}, 
        {"id": 2, "name": "second"}, 
        {"id": 3, "name": "third"}
      ];
}]);

我的模板：

  <body ng-controller="TestController">
    Selected item must be {{ array[test-1].name }}
    <select ng-model="myModel">
      <option value="">Choose item..</option>
      <option ng-repeat="item in array" 
              ng-value="item.id" 
              ng-selected="item.id == test">
        {{ item.name }} ({{item.id == test}})
      </option>
    </select>
  </body>

非常感谢您的帮助！

Answer 1

不要将 ngSelected 与 ngRepeat 一起使用。使用 ngOptions:

  <body ng-controller="TestController">
    Selected item must be {{ array[test-1].name }}
    <select ng-model="myModel" ng-options="item.id as item.name for item in array">
      <option value="">Choose item..</option>
    </select>
  </body>

Answer 2

不要将 `ngSelected` 与 `ngModel`

一起使用

来自文档：

Note: ngSelected does not interact with the <select> and ngModel directives, it only sets the selected attribute on the element. If you are using ngModel on the select, you should not use ngSelected on the options, as ngModel will set the select value and selected options.

— AngularJS ng-selected API Reference

查看其他文档：

参见 Whosebug：

AngularJS。当 select 具有 ng-model 属性时，ng-selected 不工作

AngularJS. When select have ng-model attribute, ng-selected not working

angularjs

angularjs-ng-model

不要将 `ngSelected` 与 `ngModel`

AngularJS。当 select 具有 ng-model 属性时，ng-selected 不工作

AngularJS. When select have ng-model attribute, ng-selected not working

angularjs

angularjs-ng-model

不要将 ngSelected 与 ngModel

不要将 `ngSelected` 与 `ngModel`