Question

在AngularJs <select>中填充选项时，将添加一个额外的默认<option>，直到选择了一个值。

例如：

  <select 
    ng-model="select1"
    ng-options="title as title for title in ['Option 1', 'Option 2', 'Option 3']">
  </select>

生成以下HTML标记：

<select ng-model="select1" ng-options="title as title for title in ['Option 1', 'Option 2', 'Option 3']" class="ng-pristine ng-valid ng-empty ng-touched">
   <option value="?" selected="selected"></option>
   <option label="Option 1" value="string:Option 1">Option 1</option>
   <option label="Option 2" value="string:Option 2">Option 2</option>
   <option label="Option 3" value="string:Option 3">Option 3</option>
</select>

选择一个选项后，例如“选项1”，则删除初始<option>元素：

<select ng-model="select1" ng-options="title as title for title in ['Option 1', 'Option 2', 'Option 3']" class="ng-valid ng-touched ng-not-empty ng-dirty ng-valid-parse">
   <option label="Option 1" value="string:Option 1">Option 1</option>
   <option label="Option 2" value="string:Option 2">Option 2</option>
   <option label="Option 3" value="string:Option 3">Option 3</option>
</select>

但是我想添加默认值“请选择”，一旦选择了值，也会删除。

如果我将<select>设置为：

<select ng-model="select1" ng-options="title as title for title in ['Option 1', 'Option 2', 'Option 3']"> <option value="">Please Select</option> </select>

然后，一旦选择了值，就不会删除该值。

我也尝试将value设置为?，但之后没有显示该选项。

这是一个显示我的问题的JsFiddle示例：https://jsfiddle.net/rq2cgedm/

如何在<select>元素中显示一个默认值，该元素在选择了有效选项后被删除，就像默认的AngularJs行为一样？

Answer 1

我做了一些小提琴，你可以通过添加一个禁用和隐藏的选项来解决这个问题，但也可以设置为默认值。

这会导致选项中未显示选项，但仍会将值显示为默认值。这似乎是你想要实现的目标。

例如：

<select ng-model="select2" ng-options="title as title for title in ['Option 1', 'Option 2', 'Option 3']">
    <option value="" disabled selected style="display: none;">Please Select</option>
</select>

我还要updated your fiddle来演示。

Answer 2

我建议您在选项上使用ng-repeat而不是ng-option。这将允许您保留原始默认值。

<select ng-model="select1">
    <option ng-value="" >default</option>
    <option ng-repeat="option in ['Option 1', 'Option 2', 'Option 3'] track by $index" ng-value="string:option">{{option}}</option>
</select>

不确定这是不是你的意思

将默认值设置为AngularJs选择ng-options中不存在的值

2 个答案: