angularJS的radio实现单项二选一的使用方法


Posted in Javascript onFebruary 28, 2018

废话少说,直接上代码:

<div class="col-xs-3">
 <input type="radio" ng-value=1 ng-model="sss" name="aaa" >男
 </label>
 <label>
 <input type="radio" ng-value=0 ng-model="sss" name="aaa">女
 </label>
</div>
<div>
 {{sss}}
</div>

在ng中使用radio实现二选一的时候,需要注意几个地方:

第一:保持name的属性值要是一致的;

第二:保持ng-model对应同一个值;

第三:需要为每个radio设置ng-value,因为ng-model的对应的值就是选中的那个radio所对应的ng-value的值。

angularJS的radio实现单项二选一的使用方法

由此实现了单选,且能够传递不同的值。

以上这篇angularJS的radio实现单项二选一的使用方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript-TreeView父子联动效果保持节点状态一致
Aug 12 Javascript
js类式继承的具体实现方法
Dec 31 Javascript
js实现跟随鼠标移动且带关闭功能的图片广告实例
Feb 26 Javascript
JS实现浏览器状态栏文字闪烁效果的方法
Oct 27 Javascript
js检测离开或刷新页面时表单数据是否更改的方法
Aug 02 Javascript
ES6入门教程之Iterator与for...of循环详解
May 17 Javascript
Jquery 动态添加元素并添加点击事件实现过程解析
Oct 12 jQuery
es6 super关键字的理解与应用实例分析
Feb 15 Javascript
javascript-hashchange事件和历史状态管理实例分析
Apr 18 Javascript
vue+elementui实现点击table中的单元格触发事件--弹框
Jul 18 Javascript
解决iView Table组件宽度只变大不变小的问题
Nov 13 Javascript
关于小程序优化的一些建议(小结)
Dec 10 Javascript
vue cli 全面解析
Feb 28 #Javascript
js实现动态改变radio状态的方法
Feb 28 #Javascript
快速了解vue-cli 3.0 新特性
Feb 28 #Javascript
jquery radio 动态控制选中失效问题的解决方法
Feb 28 #jQuery
vue.js根据代码运行环境选择baseurl的方法
Feb 28 #Javascript
vue+element实现批量删除功能的示例
Feb 28 #Javascript
vue.js给动态绑定的radio列表做批量编辑的方法
Feb 28 #Javascript
You might like
php下载文件源代码(强制任意文件格式下载)
2014/05/09 PHP
CodeIgniter基于Email类发邮件的方法
2016/03/29 PHP
PHP与Perl之间知识点区别整理
2019/03/19 PHP
Mootools 1.2教程(3) 数组使用简介
2009/09/14 Javascript
jQuery 学习第六课 实现一个Ajax的TreeView
2010/05/17 Javascript
jQuery对象和DOM对象之间相互转换的方法介绍
2015/02/28 Javascript
深入浅析JavaScript中的作用域和上下文
2016/03/26 Javascript
AngularJS 应用身份认证的技巧总结
2016/11/07 Javascript
angular双向绑定模拟探索
2016/12/26 Javascript
javascript prototype原型详解(比较基础)
2016/12/26 Javascript
jquery PrintArea 实现票据的套打功能(代码)
2017/03/17 Javascript
AngularJS 单选框及多选框的双向动态绑定
2017/04/20 Javascript
vue.js之vue-cli脚手架的搭建详解
2017/05/05 Javascript
前端页面文件拖拽上传模块js代码示例
2017/05/19 Javascript
微信小程序开发之toast提示插件使用示例
2017/06/08 Javascript
修改UA在PC中访问只能在微信中打开的链接方法
2017/11/27 Javascript
Node.js上传文件功能之服务端如何获取文件上传进度
2018/02/05 Javascript
分享vue里swiper的一些坑
2018/08/30 Javascript
mock.js模拟数据实现前后端分离
2019/07/24 Javascript
js实现表格单列按字母排序
2020/08/12 Javascript
[06:33]DOTA2亚洲邀请赛小组赛第二日 TOP10精彩集锦
2015/01/31 DOTA
Python with用法实例
2015/04/14 Python
一步步教你用Python实现2048小游戏
2017/01/19 Python
python编程实现随机生成多个椭圆实例代码
2018/01/03 Python
Python数据处理numpy.median的实例讲解
2018/04/02 Python
pandas apply 函数 实现多进程的示例讲解
2018/04/20 Python
Python数据类型之Set集合实例详解
2019/05/07 Python
Python Django form 组件动态从数据库取choices数据实例
2020/05/19 Python
python 实现的车牌识别项目
2021/01/25 Python
美国最顶级的精品店之一:Hampden Clothing
2016/12/22 全球购物
烈士陵园扫墓感想
2015/08/07 职场文书
什么是执行力?9个故事告诉您:成功绝非偶然!
2019/07/05 职场文书
pytorch Dropout过拟合的操作
2021/05/27 Python
Go语言应该什么情况使用指针
2021/07/25 Golang
Mysql中@和@@符号的详细使用指南
2022/06/05 MySQL
Python日志模块logging用法
2022/06/05 Python