AngularJS为null的null值

Question

我找不到使用AngularJS 设置null值的优雅方法<select>.

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

这应该适合你:

控制器:

  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>

工作plnkr

你应该使用ng-options和select.

Answer 2

你可以使用ngOptions指令select.根据文件:

可选地,可以将单个硬编码<option>元素(其值设置为空字符串)嵌套到<select>元素中.然后,此元素将表示null"未选择"选项.请参阅下面的示例进行演示

<select ng-model="obj.selected" ng-options="key as label for (key, label) in ['No', 'Yes']">
  <option value="">Unknown</option>
</select>

显然,直接在控制器中定义选项列表是一个更好的主意.