javascript - 选择的 AngularJS 空值

Question

我找不到优雅的方式来设置 null <select> 的值使用 AngularJS。

HTML:

<select ng-model="obj.selected">
  <option value=null>Unknown</option>
  <option value="1">Yes</option>
  <option value="0">No</option>
</select>

{{obj}}

JS:

$scope.obj ={"selected":null};

加载页面时，选择第一个选项，很好，输出为{"selected":null} .当切换到另一个选项后重新选择第一个选项时，输出变为 {"selected":"null"} (带引号)，这不是我所期望的。

运行示例: http://plnkr.co/edit/WuJrBBGuHGqbKq6yL4La

我知道标记 <option value=null>是不正确的。我也试过 <option value="">但它对应于一个空 String 而不是 null :因此第一个选项未被选中，而另一个选项在默认情况下选择了第一个选择后消失。

有什么想法吗？

Answer 1

这应该适合你:

Controller :

  function MyCntrl($scope) {
    $scope.obj ={"selected":null};
    $scope.objects = [{id: 1, value: "Yes"}, {id: 0, value: "No"}]
  }

模板:

  <div ng-controller="MyCntrl">

    <select ng-model="obj.selected"
            ng-options="value.id as value.value for value in objects">
            <option value="">Unknown</option>
    </select>

<br/>
     {{obj}}
  </div>

Working plnkr

您应该将 ng-options 与 select 结合使用。