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 相关文章推荐
锋利的jQuery 要点归纳(二) jQuery中的DOM操作(下)
Mar 23 Javascript
收集的一些Array及String原型对象的扩展实现代码
Dec 05 Javascript
JavaScript的漂亮的代码片段
Jun 05 Javascript
jQuery Masonry瀑布流布局神器使用详解
May 25 jQuery
使用 jQuery 实现表单验证功能
Jul 05 jQuery
JavaScript实现无刷新上传预览图片功能
Aug 02 Javascript
React Native中NavigatorIOS组件的简单使用详解
Jan 27 Javascript
vue2.0模拟锚点的实例
Mar 14 Javascript
Vue.js中的computed工作原理
Mar 22 Javascript
vue-cli webpack 引入swiper的操作方法
Sep 15 Javascript
解决vue v-for src 图片路径问题 404
Nov 12 Javascript
javascript实现雪花飘落效果
Aug 19 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
对squid中refresh_pattern的一些理解和建议
2009/04/17 PHP
javascript String 对象
2008/04/25 Javascript
Javascript级联下拉菜单以及AJAX数据验证核心代码
2013/05/10 Javascript
jquery中文乱码的多种解决方法
2013/06/21 Javascript
JS实现很酷的EMAIL地址添加功能实例
2015/02/28 Javascript
JavaScript里实用的原生API汇总
2015/05/14 Javascript
jQuery实现dialog设置focus焦点的方法
2015/06/10 Javascript
Three.js学习之网格
2016/08/10 Javascript
Bootstrap实现提示框和弹出框效果
2017/01/11 Javascript
JS组件系列之JS组件封装过程详解
2017/04/28 Javascript
JavaScript仿微信(电话)联系人列表滑动字母索引实例讲解(推荐)
2017/08/16 Javascript
让bootstrap的carousel支持滑动滚屏的实现代码
2017/11/27 Javascript
node.js中fs文件系统目录操作与文件信息操作
2018/02/24 Javascript
TypeScript基础入门教程之三重斜线指令详解
2018/10/22 Javascript
vue 实现搜索的结果页面支持全选与取消全选功能
2019/05/10 Javascript
layui实现数据表格隐藏列的示例
2019/10/25 Javascript
vue+element导航栏高亮显示的解决方式
2019/11/12 Javascript
[01:12:27]EG vs Secret 2018国际邀请赛淘汰赛BO3 第二场 8.22
2018/08/23 DOTA
[08:38]DOTA2-DPC中国联赛 正赛 VG vs Elephant 选手采访
2021/03/11 DOTA
python类定义的讲解
2013/11/01 Python
Python聊天室程序(基础版)
2018/04/01 Python
Python多继承顺序实例分析
2018/05/26 Python
Python3爬虫之urllib携带cookie爬取网页的方法
2018/12/28 Python
python 默认参数相关知识详解
2019/09/18 Python
k-means 聚类算法与Python实现代码
2020/06/01 Python
经典C++面试题一
2016/11/06 面试题
工程力学专业毕业生求职信
2013/10/06 职场文书
大学生职业生涯规划书参考模板
2014/03/05 职场文书
敬老院活动总结
2014/04/28 职场文书
计算机专业求职信
2014/06/02 职场文书
珠宝的促销活动方案
2014/08/31 职场文书
小学2016年“我们的节日·重阳节”活动总结
2016/04/01 职场文书
扩展多台相同的Web服务器
2021/04/01 Servers
解读MySQL的客户端和服务端协议
2021/05/10 MySQL
Nginx 匹配方式
2022/05/15 Servers
Android 中的类文件和类加载器详情
2022/06/05 Java/Android