Angular select 未反映其模型

Question

我的行为很奇怪。我是 Angular 的新手，可能我做错了什么。

这是我的场景：

HTML:

<div ng-controller="ExampleController">
  <label>Color:
    <select ng-model="myColor" ng-options="color.name for color in colors">
    <option value="">-- choose color --</option>
    </select>
  </label>
 <div>
<button ng-click="myColor = { name:'not in list', shade: 'other' }">clear</button>
 </div>
</div>

JS:

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];
  }]);

这里是 fiddle:

https://jsfiddle.net/t18uggqt/

谁能帮助我，请理解为什么 select 没有反映模型（只有第一个可用）

谢谢！

Answer 1

在你的 jsfiddle 中，你没有包含 ng-app="selectExample"

并在使用 jsFiddle 时在 body/head 中调用 angularJs。

请查找更新后的fiddle：https://jsfiddle.net/varit05/t18uggqt/4/

希望对你有所帮助

干杯:)

Angular select 未反映其模型

Angular select doesn't reflect its model

angularjs

select

ng-options