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 each函数的链式调用
Jul 22 Javascript
jquery 提交值不为空的元素示例代码
May 10 Javascript
javascript实现在线客服效果
Jul 15 Javascript
通用javascript代码判断版本号是否在版本范围之间
Nov 29 Javascript
简单实现的JQuery文本框水印插件
Jun 14 Javascript
Angular将填入表单的数据渲染到表格的方法
Sep 22 Javascript
vue轮播图插件vue-concise-slider的使用
Mar 13 Javascript
Angular 4.x+Ionic3踩坑之Ionic3.x pop反向传值详解
Mar 13 Javascript
webpack 3.X学习之多页面打包的方法
Sep 04 Javascript
vue + typescript + video.js实现 流媒体播放 视频监控功能
Jul 07 Javascript
JS实现的tab切换并显示相应内容模块功能示例
Aug 03 Javascript
node.js文件操作系统实例详解
Nov 05 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 pack与unpack 摸板字符字符含义
2009/10/29 PHP
超级简单的php+mysql留言本源码
2009/11/11 PHP
PHP substr 截取字符串出现乱码问题解决方法[utf8与gb2312]
2011/12/16 PHP
php字符串函数学习之strstr()
2015/03/27 PHP
Windows下php+mysql5.7配置教程
2017/05/16 PHP
JS Excel读取和写入操作(模板操作)实现代码
2010/04/11 Javascript
JavaScript类库D
2010/10/24 Javascript
网页编辑器ckeditor和ckfinder配置步骤分享
2012/05/24 Javascript
JQuery筛选器全系列介绍
2013/08/27 Javascript
如何判断鼠标是否在DIV的区域内
2013/11/13 Javascript
jquery设置按钮停顿3秒不可用
2014/03/07 Javascript
JavaScript实现99乘法表及隔行变色实例代码
2016/02/24 Javascript
详解能在多种前端框架下使用的表格控件
2017/01/11 Javascript
JS仿Base.js实现的继承示例
2017/04/07 Javascript
基于jQuery实现手风琴菜单、层级菜单、置顶菜单、无缝滚动效果
2017/07/20 jQuery
解决vue中无法动态修改jqgrid组件 url地址的问题
2018/03/01 Javascript
vue返回上一页面时回到原先滚动的位置的方法
2018/12/20 Javascript
Vue渲染过程浅析
2019/03/14 Javascript
vue v-for循环重复数据无法添加问题解决方法【加track-by='索引'】
2019/03/15 Javascript
jQuery实现带3D切割效果的轮播图功能示例【附源码下载】
2019/04/04 jQuery
angular 实现同步验证器跨字段验证的方法
2019/04/11 Javascript
[01:52]2014DOTA2西雅图邀请赛 V社开大会你不知道的小秘密
2014/07/08 DOTA
python面向对象_详谈类的继承与方法的重载
2017/06/07 Python
python如何为被装饰的函数保留元数据
2018/03/21 Python
Python 实现两个服务器之间文件的上传方法
2019/02/13 Python
在python中利用numpy求解多项式以及多项式拟合的方法
2019/07/03 Python
wxPython+Matplotlib绘制折线图表
2019/11/19 Python
python 实现 hive中类似 lateral view explode的功能示例
2020/05/18 Python
迪卡侬印度官网:购买所有体育用品
2017/06/24 全球购物
《再见了,亲人》教学反思
2014/02/26 职场文书
大班亲子运动会方案
2014/06/10 职场文书
2015年大学生暑期实习报告
2015/07/13 职场文书
小学作文之描写天气
2019/08/15 职场文书
聊一聊Redis与MySQL双写一致性如何保证
2021/06/26 Redis
Redis 哨兵机制及配置实现
2022/03/25 Redis
基于Python实现射击小游戏的制作
2022/04/06 Python