如何使用当前“selected”属性渲染ng-select的选项列表

时间:2014-10-19 02:33:00

标签: javascript html5 angularjs

documentation中使用ng-select的示例,包含在下面的代码段中。



<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script>
angular.module('selectExample', [])
  .controller('ExampleController', ['$scope', function($scope) {
    $scope.colors = [
      {name:'black', shade:'dark'},
      {name:'white', shade:'light'},
      {name:'red', shade:'dark'},
      {name:'blue', shade:'dark'},
      {name:'yellow', shade:'light'}
    ];
    $scope.myColor = $scope.colors[2]; // red
  }]);
</script>
<div ng-app="selectExample" ng-controller="ExampleController">
  <select ng-model="myColor" ng-options="color.name for color in colors"></select>
  <p>Selected: {{myColor}}</p>
</div>
&#13;
&#13;
&#13;

但是当您选择与默认颜色不同的颜色(红色)时,仍会使用

呈现HTML
<option value="2" selected="selected">red</option>

这是错的吗?如果是这样,我该如何解决?

1 个答案:

答案 0 :(得分:0)

我认为这不是错误的。

来自MDN

  

已选择

     

如果存在,则此布尔属性表示该选项   最初被选中。如果元素是后代   未设置多个属性的元素,只有一个元素    此元素可能具有所选属性。

来自HTML5 Spec

  

所选属性是布尔属性。它表示元素的默认选择性。

两者都声明selected表示<option>元素的默认/初始状态,而不是其当前状态。