过去几周我一直在使用AngularJS,有一件事真的困扰着我,即使在http://docs.angularjs.org/api/ng.directive:select的规范中尝试了所有的排列或配置,我仍然得到一个空选项作为select元素的第一子元素。
这是玉:
select.span9(ng-model='form.type', required, ng-options='option.value as option.name for option in typeOptions');
下面是控制器:
$scope.typeOptions = [
{ name: 'Feature', value: 'feature' },
{ name: 'Bug', value: 'bug' },
{ name: 'Enhancement', value: 'enhancement' }
];
最后,这里是生成的HTML:
<select ng-model="form.type" required="required" ng-options="option.value as option.name for option in typeOptions" class="span9 ng-pristine ng-invalid ng-invalid-required">
<option value="?" selected="selected"></option>
<option value="0">Feature</option>
<option value="1">Bug</option>
<option value="2">Enhancement</option>
</select>
我需要做什么才能摆脱它?
附注:没有这个也可以工作,但是如果使用select2而没有多重选择,它看起来很奇怪。
如果需要初始值,请参阅@pkozlowski。开源的答案,供你参考,它也可以在视图中(而不是在控制器中)使用ng-init实现:
<select ng-model="form.type" required="required" ng-init="form.type='bug'"
ng-options="option.value as option.name for option in typeOptions" >
</select>
如果你不想要一个初始值,“一个硬编码的元素,将值设置为空字符串,可以嵌套到元素中。该元素将表示null或“未选中”选项:
<select ng-model="form.type" required="required"
ng-options="option.value as option.name for option in typeOptions" >
<option style="display:none" value="">select a type</option>
</select>
在这里的众多答案中,我认为我应该转发对我有效的解决方案,并满足以下所有条件:
当ng-model是假的时提供一个占位符/提示符。——select region——" w. value="")
当ng-model值为假值时,用户打开options下拉菜单,则选择占位符(此处提到的其他解决方案使第一个选项显示为选中,这可能会产生误导)
允许用户取消选择有效值,实际上是再次选择假值/默认值
code
<select name="market_vertical" ng-model="vc.viewData.market_vertical"
ng-options="opt as (opt | capitalizeFirst) for opt in vc.adminData.regions">
<option ng-selected="true" value="">select a market vertical</option>
</select>
src
独创的q&a - https://stackoverflow.com/a/32880941/1121919