AngularJS进阶(四十二)ng-options渲染的第一项为空的解决办法
发布时间:2020-12-17 08:54:29 所属栏目:安全 来源:网络整理
导读:AngularJS进阶(四十二)ng-options渲染的第一项为空的解决办法 现象 我们在使用ng-options时,如果首次使用,可能会在渲染完成后发现下拉列表的第一项为空,并且我们在选择一项之后,为空的第一项已经消失了,这样用户体验上来说很不好。 原因 原因就在于:我
AngularJS进阶(四十二)ng-options渲染的第一项为空的解决办法现象我们在使用ng-options时,如果首次使用,可能会在渲染完成后发现下拉列表的第一项为空,并且我们在选择一项之后,为空的第一项已经消失了,这样用户体验上来说很不好。 原因原因就在于:我们使用ng-options的时候,是配合模型指令ng-model一起使用的,从而我们就可以知道,渲染生成的第一项为空原因肯定和ng-model的初始值有关系。 解决办法
示例控制器var instsData ={
"result":"0000","errtext":"","data":[
{"instName":"中国银行","instCode":"000996"},{"instName":"中国西电","instCode":"601179"},{"instName":"中国重汽","instCode":"000951"}
]};
var results = instsData.data;
$scope.inst = results[0];
$scope.insts = results;
html<select id="selectInput" style="display:none"
ng-model="inst"
ng-options="inst.instCode as inst.instName for inst in insts" ng-change="doChange()">
<option value="">----请选择----</option>
</select>
效果 (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |