首页 > Web开发 > 详细

AngularJS ng-options下拉菜单绑定数值

时间:2016-05-29 10:51:18      阅读:575      评论:0      收藏:0      [点我收藏+]

这两天做了一个页面,结构比较简单,最上方有两个下拉菜单,选择后点击确定,浏览器会通过AJAX获取数据并在下方生成表格。

因为刚接触AngularJS,最近经常性地陷入某些"陷阱"中 = =

这次遇到的一个问题是,当我写成形如以下格式的时候:

select
  option(ng-repeat="item in itemList" ng-model="choosenItem" value="{{item}}") {{item}}

可以生成下拉菜单,但无论其中的ng-model="choosenItem"还是value="{{item}}",都无法绑定选择的数值,打印出的choosenItem始终是itemList中的第一个值。

这种情况下,我能想到的方法,就是利用item作为option的ID,用原生JS或者jQuery进行取值,这样代码就写得太拙计了。

 

 最终采取的方案是采用ng-options生成下拉菜单:

select(ng-model="choosenItem" ng-options="item for item in itemList")

这样就可以直接将选择的item绑定到ng-model上了,这种写法比前面简单多了。

 

AngularJS的常用指令一定要掌握全面,不然有时候就会陷入到这种困境,明明有很简单的方法,却要用很丑陋的方式来重新实现一遍。

AngularJS ng-options下拉菜单绑定数值

原文:http://www.cnblogs.com/istream/p/5539000.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!