Angular的ng-options的value值是错误的

最新推荐文章于 2021-01-13 17:41:38 发布
最新推荐文章于 2021-01-13 17:41:38 发布
阅读量374 收藏
点赞数
分类专栏： angularJS
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/weixin_39407291/article/details/105386101
版权
在使用Angular框架时，若采用JS原生或jQuery方法获取select元素的option值，可能会错误地得到索引值而非实际value值。本文探讨了这一现象，并提供了相关博客链接供进一步研究。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

在使用angular时，如果用js原生或者jQuery去获取select的option的value值，会发现获取到的是索引值，会出现错误。
参考博客：https://segmentfault.com/q/1010000004305247/a-1020000004305320

angular里ng-options、ng-select是如何使用的？
IT修真院：初学者转行到互联网的聚集地
05-29 964
这里是修真院前端小课堂，每篇分享文从 【背景介绍】【知识剖析】【常见问题】【解决方案】【编码实战】【扩展思考】【更多讨论】【参考文献】 八个方面深度解析前端知识/技能，本篇分享的是： 【angular里ng-options、ng-select是如何使用的？ 】 腾讯视频 ng-options和ng-select都属于angluar里的作用在表格或者下拉菜单的标签。 ng-op...
angular中的常见指令ng-if、ng-class、ng-options、ng-value、ng-click
learning_web的博客
08-26 1188
这里是修真院前端小课堂，每篇分享文从 八个方面深度解析前端知识/技能，本篇分享的是： 【angular中的常见指令ng-if、ng-class、ng-options、ng-value、ng-click】 大家好，我是 IT 修真院上海分院第八期的学员何岳，一枚正直纯洁善良的web程序员 今天给大家分享一下，修真院官网 JS任务八，深度思考中的知识点——angular中的常见指令ng-if、ng-c...
AngularJs ng-options 无法设置value的问题
热门推荐
coding
05-07 1万+
AngularJS 是一个神奇的东西，但学习过程中总会碰到不少问题。 被ng-options的value设值问题困扰了不少时间，终于解决了，这里记录一下。 页面语法: 设置model： 按照道理这样应该是ok了，但是打开F12却看到了这个： 这就不科学了。 问题出在哪儿呢？问题出在我的查看方式上面。。。。。 正确
ng-options设置option的value属性
lzf的博客
07-24 6988
If you use the track by option, the value attribute is correctly written, e.g.:<div ng-init="a = [{label: 'one', value: 15}, {label: 'two', value: 20}]"> <select ng-model="foo" ng-options...
angular指令笔记（一）：ng-options
weixin_34288121的博客
09-15 192
1、ng-options指令用途： 在表达式中使用数组或对象来自动生成一个select中的option列表。ng-options与ng-repeat很相似，很多时候可以用ng-repeat来代替ng-options。但是ng-options提供了一些好处，例如减少内存提高速度，以及提供选择框的选项来让用户选择。当select中一个选项被选择，该选项将会使用ng-model自动绑定到对应数据上。如...
【Angular】select标签，ng-options标签中，下拉列表动态查询，默认值为空；
陶洲川的博客
10-19 2515
一、问题描述js源代码： /*专业初始化初始化：warn 必须初始化具体*/ $scope.majorList = [ { id:0 ,name:"1"} ]; /*岗位初始化：position*/ $scope.positionList = [
《我的Angular入坑记》——ng-options的使用
皮蛋瘦肉没有肉
04-21 4856
ng-options 指令用于使用 填充 元素的选项，当select中一个选项被选择，该选项将会被绑定到ng-model。 ng-options 指令使用数组或对象来填充下拉列表，多数情况下与 ng-repeat 指令一起使用。 Title 请选择城市 {{city}} var m =
Angular中ng-options下拉数据默认值的设定方法
08-30
本篇文章聚焦于如何在使用`ng-options`时设定下拉列表的默认选中值。我们将通过一个具体的示例来详细解释这一过程。 首先，我们来看一下HTML部分： ```html <div class="form-group"> <label class="col-sm-2 ...
angular指令笔记ng-options的使用方法
12-08
- ng-model是Angular中用于双向数据绑定的指令，与ng-options一起使用时，ng-model的值会随着用户在下拉框中的选择而更新，反之亦然。如果你想要设置默认值，可以直接在控制器中初始化ng-model，比如`$scope....
angularjs select 赋值 ng-options配置方法
11-28
下面将详细介绍如何使用`ng-options`进行配置，并提供相关的示例。 1. **数组方式配置** 当数据源是一个简单的数组时，`ng-options`可以这样配置： ```javascript $scope.years = [2014, 2015, 2016]; ``` 在...
AngularJS下拉列表select在option动态变化之后多出了一个错误项的问题
weixin_34409703的博客
10-17 247
场景： Select初始化之后，选中select的某个选项 通过AngularJS更新select的选项 错误写法： HTML(使用ng-repeat) 　　<div ng-app="TestApp"> <div ng-controller="TestAppCtrl"> <label>options...
如何在AngularJS的ng-options中设置value属性？
asdfgh0077的博客
04-24 711
Here is what seems to be bothering a lot of people (including me). 这似乎困扰了很多人（包括我）。 When using the
angularJs select ng-options 绑定int型的时候绑定失效的坑
weixin_30856965的博客
03-18 315
<select ng-model="editObj.AdType" ng-options=" type.id as type.name for type in adTypes "></select> 其中type.id是int，这样绑定后下拉框会生成。但是不管editObj.AdType的值是什么都无法绑定成功。 原因在于ng-options会把int型自动...
AngularJS中ng-options简单用法及预选项失败的原因
weixin_33969116的博客
04-07 182
刚刚接触AngularJs，记录一下ng-options的使用。 1、构造key-value数据 $scope.types = [ {id:"1",type:"AA"}, {id:"2",type:"BB"}, {id:"3",type:"CC"} ]; 2、绑定 <select ng-model=...
Angularjs 关于Angularjs的ng-options设置下拉框的value的值
beyond丿灬的博客
10-12 2963
&lt;div ng-app="myApp" ng-controller="myCtrl"&gt; &lt;select ng-model="selectedName" ng-options="item.id as item.name for item in names"&gt; //item.id这个部分是设置value,item.name这个部分是设置label的属性值,names为
angular4中ngModel双向绑定在限制输入情况下与value值不一致的问题及尝试的解决方法
rushichunqiu的博客
01-25 8432
近期公司的一个后台项目在使用angular4进行开发，随着项目的推进和迭代开发，需要对有的input框的value值进行限制输入，例如目前项目的一些input框只允许输入数字和'.' 这两种形式的内容。就在input标签的中添加了（keyup）属性，将相应的ts文件中编写的一个正则验证方法赋值给该属性，以便进行验证，如下所示： 元/次 {{normal.price}} ||| {{price
【已解决】angularjs的select里option显示为＜option value=“? number:xxx ?“ ＞＜/option＞
程序边界
01-13 1482
问题： 功能可以正常使用，但是默认值或是之前选中的值无法正常在刚打开的页面显示： 查看开发人员工具发现多了一个<option value="? number:xxx ?" ></option>，而且保存刷新后不能回显。 解决 把ng-model绑定的数据变成字符串： ng-model="data.Mode+''" ng-model="data.Mode.toString()" 寻因 原因是value的值是一个字符串（写成value=0也不管用），ng-model却是个numb
ng-option取值问题
weixin_33738555的博客
11-16 160
怎么获取后台返回的一条数据，正常我们这么写 <select ng-model="enterEditComName" ng-options="m.id as m.name for m in comDeptList"></select> 如果这么写，angular数据双向绑定是获取id值的，而name想要获取的话则很不方便，$scope.enterEditComName获取...
Angular指令深度解析：ng-options与select的label-value原理
"关于Angular指令ng-options的使用和理解" 在AngularJS中，`ng-options`是一个非常有用的指令，用于根据数组或对象自动生成`<select>`元素的`<option>`列表。这个指令允许我们更灵活地控制选项的生成，并且在处理...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值