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 相关文章推荐
用 JavaScript 迁移目录
Dec 18 Javascript
JS 无法通过W3C验证的处理方法
Mar 09 Javascript
jQuery判断checkbox是否选中的小例子
Dec 02 Javascript
PageSwitch插件实现100种不同图片切换效果
Jul 28 Javascript
JavaScript在控件上添加倒计时功能的实现代码
Jul 04 Javascript
利用Ionic2 + angular4实现一个地区选择组件
Jul 27 Javascript
VUE饿了么树形控件添加增删改功能的示例代码
Oct 17 Javascript
javascript判断一个变量是数组还是对象
Apr 10 Javascript
jQuery实现验证用户登录
Dec 10 jQuery
vue实现图片上传功能
May 28 Javascript
js实现详情页放大镜效果
Oct 28 Javascript
详解JVM系列之内存模型
Jun 10 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遍历目录函数opendir()、readdir()、closedir()、rewinddir()总结
2014/11/18 PHP
PHP实现删除字符串中任何字符的函数
2015/08/11 PHP
php发送http请求的常用方法分析
2016/11/08 PHP
php接口实现拖拽排序功能
2018/04/23 PHP
PHP实现redis限制单ip、单用户的访问次数功能示例
2018/06/16 PHP
如何在PHP中使用数组
2020/06/09 PHP
常用js脚本
2006/12/03 Javascript
通过jQuery打造支持汉字,拼音,英文快速定位查询的超级select插件
2010/06/18 Javascript
javascript中关于执行环境的杂谈
2011/08/14 Javascript
Js动态添加复选框Checkbox的实例方法
2013/04/08 Javascript
jquery队列函数用法实例
2014/12/16 Javascript
jQuery之DOM对象和jQuery对象的转换与区别分析
2015/01/08 Javascript
15款jQuery分布引导插件分享
2015/02/04 Javascript
javascript运动详解
2015/07/06 Javascript
javascript实现点击单选按钮链接转向对应网址的方法
2015/08/12 Javascript
理解js对象继承的N种模式
2016/01/25 Javascript
JavaScript中的prototype原型学习指南
2016/05/09 Javascript
基于JS实现的随机数字抽签实例
2016/12/08 Javascript
NodeJs测试框架Mocha的安装与使用
2017/03/28 NodeJs
浅析微信小程序modal弹窗关闭默认会执行cancel问题
2019/10/14 Javascript
JS实现简单日历特效
2020/01/03 Javascript
详解vite+ts快速搭建vue3项目以及介绍相关特性
2021/02/25 Vue.js
[29:16]完美世界DOTA2联赛决赛日 Inki vs LBZS 第三场 11.08
2020/11/10 DOTA
在Django框架中编写Contact表单的教程
2015/07/17 Python
django数据库migrate失败的解决方法解析
2018/02/08 Python
日本面向世界,国际级的免税在线购物商城:DOKODEMO
2017/02/01 全球购物
如何通过jdbc调用存储过程
2012/04/19 面试题
员工自我鉴定范文
2013/10/06 职场文书
简历的自荐信
2013/12/19 职场文书
商场端午节活动方案
2014/01/29 职场文书
生产部岗位职责范文
2014/02/07 职场文书
十佳青年事迹材料
2014/08/21 职场文书
小学生田径运动会广播稿
2014/09/11 职场文书
延安红色之旅心得体会
2014/10/07 职场文书
大学生军训感言
2015/08/01 职场文书
浅析Python中的随机采样和概率分布
2021/12/06 Python