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 相关文章推荐
List the Codec Files on a Computer
Jun 18 Javascript
Javascript的数组与字典用法与遍历对象的属性技巧
Nov 07 Javascript
javascript实现禁止复制网页内容
Dec 16 Javascript
百度地图API之本地搜索与范围搜索
Jul 30 Javascript
javascript图片延迟加载实现方法及思路
Dec 31 Javascript
获取input标签的所有属性的方法
Jun 28 Javascript
BootstrapTable请求数据时设置超时(timeout)的方法
Jan 22 Javascript
vue组件 $children,$refs,$parent的使用详解
Jul 31 Javascript
详解VUE自定义组件中用.sync修饰符与v-model的区别
Jun 26 Javascript
JS二级菜单不同实现方法分析【4种方法】
Dec 21 Javascript
浅谈vue 多个变量同时赋相同值互相影响
Aug 05 Javascript
js实现三角形粒子运动
Sep 22 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
destoon实现公司新闻详细页添加评论功能的方法
2014/07/15 PHP
PHP中的output_buffering详细介绍
2014/09/27 PHP
浅谈PHP解析URL函数parse_url和parse_str
2014/11/11 PHP
Javascript公共脚本库系列(一): 弹出层脚本
2011/02/24 Javascript
jquerymobile checkbox及时刷新才能获取其准确值
2012/04/14 Javascript
原生js实现淘宝首页点击按钮缓慢回到顶部效果
2014/04/06 Javascript
jQuery实现信息提示框(带有圆角框与动画)效果
2015/08/07 Javascript
使用canvas实现仿新浪微博头像截取上传功能
2015/09/02 Javascript
JS获取文件大小方法小结
2015/12/08 Javascript
bootstrap多种样式进度条展示
2016/12/20 Javascript
Vue.js结合Ueditor富文本编辑器的实例代码
2017/07/11 Javascript
浅谈Angular文字折叠展开组件的原理分析
2017/11/24 Javascript
使用vue实现grid-layout功能实例代码
2018/01/05 Javascript
layui之table checkbox初始化时选中对应选项的方法
2019/09/02 Javascript
JavaScript链式调用原理与实现方法详解
2020/05/16 Javascript
npm ci命令的基本使用方法
2020/09/20 Javascript
Python的Flask框架的简介和安装方法
2015/11/13 Python
Python读取数据集并消除数据中的空行方法
2018/07/12 Python
Python实现程序判断季节的代码示例
2019/01/28 Python
Python数据类型之Set集合实例详解
2019/05/07 Python
python安装requests库的实例代码
2019/06/25 Python
Python 如何提高元组的可读性
2019/08/26 Python
解决python明明pip安装成功却找不到包的问题
2019/08/28 Python
Python获取excel内容及相关操作代码实例
2020/08/10 Python
Python利用Pillow(PIL)库实现验证码图片的全过程
2020/10/04 Python
HTML5 Canvas渐进填充与透明实现图像的Mask效果
2013/07/11 HTML / CSS
html5实现图片转圈的动画效果——让页面动起来
2017/10/16 HTML / CSS
HTML5 source标签:媒介元素定义媒介资源
2018/01/29 HTML / CSS
HTML+CSS+JavaScript实现图片3D展览的示例代码
2020/10/12 HTML / CSS
trivago美国:全球最大的酒店价格比较网站
2018/01/18 全球购物
建筑人员岗位职责
2013/12/25 职场文书
干部培训自我鉴定
2014/01/22 职场文书
学历证明范文
2015/06/16 职场文书
2015年社区党建工作汇报材料
2015/06/25 职场文书
javascript对象3个属性特征
2021/11/17 Javascript
maven 解包依赖项中的文件的解决方法
2022/07/15 Java/Android