AngularJS:删除angular ng-repeat中的空选择选项 [英] AngularJS : Remove empty select option in angular ng-repeat
问题描述
我在这里使用 ng-repeat 来渲染具有不同值和文本的选项，并设置默认值.但 angular 再次添加了一个空的未定义选项.
I am using ng-repeat to render options with different value and text here, and also setting the default one.But again angular adds an empty undefined option.
<select ng-model="newItem.financial_year_id" required style="min-width:180px;">
<option ng-repeat="financial in account_year" value="{{financial.id}}" ng-selected="financial.status=='Active'">{{financial.financial_year}}</option>
</select>
现在活动的选项被选中，但空选项仍在呈现.
Now the active one is selected but the empty option still rendering.
推荐答案
尝试 ng-options 代替:
<select ng-model="selectedFinancial" ng-options="c.financial_year for c in account_year"
required style="min-width:180px;">
</select>
您应该考虑重新设计您的模型以使用 ng-options.当我们使用 <select> 时，只有 1 个被选中的项目，这个项目应该是 $scope 的一个属性，引用列表中的一个项目 => 我们没有需要为所有对象复制 1 个带有 "active" 和 "inactive" 的属性.
You should think about redesigning your model like that to use ng-options. When we use <select>, there is only 1 selected item and this item should be a property of $scope referencing an item in the list => we don't need to duplicate 1 more property with "active" and "inactive" for all objects.
当有超过 1 个选择项时，您当前的模型设计是有意义的，但如果有超过 1 个，我们应该使用复选框列表而不是
Your current model design makes sense when there are more than 1 selected item, but if there are more than 1, we should use a list of checkboxes instead of <select>
如果你想绑定Id，试试这个:
If you want to bind with Id, try this:
<select ng-model="selectedFinancialId" ng-options="c.id as c.financial_year for c in account_year"
required style="min-width:180px;">
</select>
这篇关于AngularJS:删除angular ng-repeat中的空选择选项的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
