angularjs 获取默认选中的单选按钮的value方法


Posted in Javascript onFebruary 28, 2018

在Html页面中,有三个单选按钮,默认选中的是第二个“重要”这个选项,设置ng-checked="true",把该选项默认选中,可是在提交表单时,却提示$scope.level为undefine状态,明明默认选中了为什么却是undefine呢?

于是,先测试了一把:在Html页面写下下面的代码:

<span style="font-size:18px;"><div ng-controller="testCtrl"> 
 <div > 
  <label > 
   <input type="radio" value="Normal" ng-model="level" name="level" 
   >一般 
  </label> 
  <label > 
   <input type="radio" value="Important" ng-model="level" name="level" 
     ng-checked="true" 
   >重要 
  </label> 
  <label > 
   <input type="radio" value="Urgent" ng-model="level" name="level" 
   >紧急 
  </label> 
 
 
 </div> 
  <div> {{ level }}</div>    //显示单选按钮选中的value 
</div></span>

页面第一次加载,虽然“重要”这个单选按钮是默认选中,但是页面却不显示重要这个单选按钮对应的value,

点击“紧急”按钮,下面会显示“紧急”按钮的value,

原来,在页面加载时,$scope.level没有被赋值,没有初始值,即便 ng-checked="true",却也不显示默认选中的值!需要在js中设置:$scope.level= "Important";这时,刷新页面,会默认显示选中的按钮的value:

以上这篇angularjs 获取默认选中的单选按钮的value方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery 对象中的类数组操作
Apr 27 Javascript
jquery对象和DOM对象的区别介绍
Aug 09 Javascript
Javascript闭包用法实例分析
Jan 23 Javascript
解析Javascript单例模式概念与实例
Dec 05 Javascript
微信小程序自动客服功能
Nov 02 Javascript
Angular 数据请求的实现方法
May 07 Javascript
详解mpvue开发小程序小总结
Jul 25 Javascript
微信小程序websocket实现即时聊天功能
May 21 Javascript
使用Vue开发自己的Chrome扩展程序过程详解
Jun 21 Javascript
js实现图片跟随鼠标移动效果
Oct 16 Javascript
vue使用一些外部插件及样式的配置代码
Nov 18 Javascript
vue2.x数组劫持原理的实现
Apr 19 Javascript
angularJS的radio实现单项二选一的使用方法
Feb 28 #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
You might like
php adodb操作mysql数据库
2009/03/19 PHP
PHP把小数转成整数3种方法
2014/06/30 PHP
php修改文件上传限制方法汇总
2015/04/07 PHP
PHP PDOStatement::getAttribute讲解
2019/02/01 PHP
Javascript 原型和继承(Prototypes and Inheritance)
2009/04/01 Javascript
JQery jstree 大数据量问题解决方法
2010/03/09 Javascript
关闭时刷新父窗口两种方法
2014/05/07 Javascript
javaScript中两个等于号和三个等于号之间的区别介绍
2014/06/27 Javascript
jQuery中:enabled选择器用法实例
2015/01/04 Javascript
jQuery插件开发精品教程让你的jQuery提升一个台阶
2016/01/27 Javascript
Google 地图获取API Key详细教程
2016/08/06 Javascript
jQuery 插件封装的方法
2016/11/16 Javascript
JavaScript字符串对象
2017/01/14 Javascript
JavaScript中英文字符长度统计方法示例【按照中文占2个字符】
2017/01/17 Javascript
基于JavaScript实现下拉列表左右移动代码
2017/02/07 Javascript
JS中input表单隐藏域及其使用方法
2017/02/13 Javascript
原生JS控制多个滚动条同步跟随滚动效果
2017/12/22 Javascript
如何快速解决JS或Jquery ajax异步跨域的问题
2018/01/08 jQuery
JavaScript 对引擎、运行时、调用堆栈的概述理解
2018/10/22 Javascript
[01:23]一分钟告诉你 DOTA2为什么叫信仰2
2014/06/20 DOTA
Python实现简单字典树的方法
2016/04/29 Python
Python 正则表达式入门(中级篇)
2016/12/07 Python
python导出chrome书签到markdown文件的实例代码
2017/12/27 Python
详解Python 4.0 预计推出的新功能
2019/07/26 Python
Python使用matplotlib实现交换式图形显示功能示例
2019/09/06 Python
python3 自动打印出最新版本执行的mysql2redis实例
2020/04/09 Python
模具数控专业自荐信
2014/01/27 职场文书
家长对小学生的评语
2014/01/28 职场文书
课例研修方案
2014/05/31 职场文书
大专生自荐书范文
2014/06/22 职场文书
我的中国梦演讲稿300字
2014/08/19 职场文书
关于感恩的演讲稿200字
2014/08/26 职场文书
预备党员思想汇报1000字
2014/10/07 职场文书
小学班主任个人总结
2015/03/03 职场文书
浅谈react useEffect闭包的坑
2021/06/08 Javascript
PyMongo 查询数据的实现
2021/06/28 Python