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 相关文章推荐
利用Ext Js生成动态树实例代码
Sep 08 Javascript
几个比较实用的JavaScript 测试及效验工具
Apr 18 Javascript
Jquery动态改变图片IMG的src地址示例
Jun 25 Javascript
常用的JavaScript WEB操作方法分享
Feb 28 Javascript
JavaScript生成随机字符串的方法
Mar 19 Javascript
详解JavaScript中的客户端消息框架设计原理
Jun 24 Javascript
JS中call/apply、arguments、undefined/null方法详解
Feb 15 Javascript
Angularjs实现mvvm式的选项卡示例代码
Sep 08 Javascript
Bootstrap模态框插入视频的实现代码
Jun 25 Javascript
JavaScript代码调试方法实例小结
Jan 05 Javascript
jquery插件开发模式实例详解
Jul 20 jQuery
基于vue.js仿淘宝收货地址并设置默认地址的案例分析
Aug 20 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
用来解析.htgroup文件的PHP类
2012/09/05 PHP
PHP的password_hash()使用实例
2014/03/17 PHP
php中获取主机名、协议及IP地址的方法
2014/11/18 PHP
高质量PHP代码的50个实用技巧必备(下)
2016/01/22 PHP
python进程与线程小结实例分析
2018/11/11 PHP
JavaScript 字符编码规则
2009/05/04 Javascript
类似CSDN图片切换效果脚本
2009/09/17 Javascript
实现JavaScript中继承的三种方式
2009/10/16 Javascript
JavaScript 全角转半角部分
2009/10/28 Javascript
Knockoutjs快速入门(经典)
2012/12/24 Javascript
js限制文本框只能输入中文的方法
2015/08/11 Javascript
jQuery插件HighCharts绘制2D金字塔图效果示例【附demo源码下载】
2017/03/09 Javascript
jquery 禁止鼠标右键并监听右键事件
2017/04/27 jQuery
Vue2.0基于vue-cli+webpack父子组件通信(实例讲解)
2017/09/14 Javascript
详述 Sublime Text 打开 GBK 格式中文乱码的解决方法
2017/10/26 Javascript
基于vue2实现左滑删除功能
2017/11/28 Javascript
微信小程序之批量上传并压缩图片的实例代码
2018/07/05 Javascript
微信小程序websocket实现即时聊天功能
2019/05/21 Javascript
Vue Router history模式的配置方法及其原理
2019/05/30 Javascript
微信小程序文章详情功能完整实例
2020/06/03 Javascript
python求斐波那契数列示例分享
2014/02/14 Python
今天 平安夜 Python 送你一顶圣诞帽 @微信官方
2017/12/25 Python
python将字典内容存入mysql实例代码
2018/01/18 Python
对python以16进制打印字节数组的方法详解
2019/01/24 Python
python3下载抖音视频的完整代码
2019/06/05 Python
解决更改AUTH_USER_MODEL后出现的问题
2020/05/14 Python
Python爬虫入门教程01之爬取豆瓣Top电影
2021/01/24 Python
python爬虫scrapy框架的梨视频案例解析
2021/02/20 Python
数据库笔试题
2013/05/09 面试题
人力资源管理专业毕业生自我评价
2013/09/21 职场文书
校长岗位职责
2013/11/26 职场文书
企业承诺书怎么写
2014/05/24 职场文书
《爱的教育》读书心得
2014/11/08 职场文书
股份转让协议书范本
2015/01/27 职场文书
关于考试抄袭的检讨书
2019/11/02 职场文书
MySQL外键约束(FOREIGN KEY)案例讲解
2021/08/23 MySQL