AngularJS - 在select标签中使用ng-repeat时添加了额外的空白选项

时间:2015-12-28 06:15:17

标签: angularjs html5 ionic-framework hybrid-mobile-app

在ng-repeat中使用时,我在选择标签上遇到了一些问题。 在Stackoverflow上,我找到了许多与我的问题相关的解决方案,但我无法解决我的问题。

这是我的代码.. 在页面顶部我定义我的控制器

<ion-view view-title="Product" ng-controller="productCtrl as pd">

并在控制器上

self.pdata = response;

在html页面上我的代码是..

<div ng-if="pd.pdata.optionid.length > 0" class="prodetail" ng-repeat="x in pd.pdata.optionid">
    <h5>{{x.title}}</h5>
    <select name="{{x.title}}" ng-model="pd[x.title]" style="right:5px;">
      <option ng-repeat="y in pd.pdata.optionvalue[x.option_id]" value="{{y.value_id}}" selected>{{y.title | uppercase}}</option>
    </select>
</div>

这里我的选择标签位于ng-repeat循环中 这样每次我的ng模型都是动态定义的。

我的问题是: - 使用选择标记中的ng-repeat添加了一个空白选项

3 个答案:

答案 0 :(得分:2)

像这样修改您的select代码,它有点满口,但也可以保留您的option代码,并从我的ng-options代码中删除select

<select ng-init="pd[x.title] = pd[x.title] || pd.pdata.optionvalue[x.option_id][0].value_id" name="{{x.title}}" ng-model="pd[x.title]" style="right:5px;" ng-options="y.value_id as y.title.toUpperCase() for y in pd.pdata.optionvalue[x.option_id]">
</select>

这是一个jsFiddle

答案 1 :(得分:0)

答案 2 :(得分:0)

使用硬编码的空值

<option value="" ng-if="false"></option>