Question

我正在尝试将我的应用程序中的angularjs从1.5迁移到1.7。

我的模型数据如下：

$scope.colors = [
  {name:'black', shade:'dark'},
  {name:'yellow', shade:'light'}
];

$scope.myColor = '';

html：

 <label>Color :
 <select ng-model="myColor"
        ng-options="color.name for color in colors">
     <option value="">-- choose color --</option>
  </select>

由于$scope.myColor是一个空字符串，因此angular会在下拉列表中呈现一个额外的<option value="?"></option>，如下所示。

<select ng-model="myColor" ng-options="color.name for color in colors" class="ng-pristine ng-untouched ng-valid ng-empty">
   <option value="?" selected="selected"></option>
   <option value="">--choose color --</option>
   <option label="black" value="object:3">black</option>
   <option label="yellow" value="object:4">yellow</option>
</select>

有什么方法可以避免显示<option value="?"></option>并在<option value="">--choose color --</option>具有空值时将其默认设置为$scope.myColor？

按预期的角度1.5可以正常工作。

这是the人：https://plnkr.co/edit/g0rVjBpM2qLrGuweP19E?p=preview

编辑：@ FDavidov，@ Houssein和@Aleksey建议我在以下答案中使用$scope.myColor = null。谢谢你但这是我企业应用程序代码库中的重大更改。我试图找出是否有其他方法可以通过更改html来实现相同的效果。

Answer 1

Vinay，

将一个空字符串（即''）分配给$scope.myColor就是一个实际值。只需删除语句$scope.myColor = '';或将''替换为null。

Answer 2

您应该将$ scope.myColor设置为null而不是“”。

angularjs 1.7选择下拉列表显示了一个额外的选项值

2 个答案: