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 相关文章推荐
通过Mootools 1.2来操纵HTML DOM元素
Sep 15 Javascript
一个简单的jQuery插件制作 学习过程及实例
Apr 25 Javascript
js下利用控制器载入对应脚本
Jul 17 Javascript
js显示时间 js显示最后修改时间
Jan 02 Javascript
js setTimeout 常见问题小结
Aug 13 Javascript
使用jquery选择器如何获取父级元素、同级元素、子元素
May 14 Javascript
JS获取图片lowsrc属性的方法
Apr 01 Javascript
javascript之with的使用(阿里云、淘宝使用代码分析)
Oct 11 Javascript
Angualrjs 表单验证的两种方式(失去焦点验证和点击提交验证)
May 09 Javascript
javascript 玩转Date对象(实例讲解)
Jul 11 Javascript
原生javascript实现连连看游戏
Jan 03 Javascript
JS实现简单打字测试
Jun 24 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
建立动态的WML站点(二)
2006/10/09 PHP
javascript 新浪背投广告实现代码
2009/07/07 Javascript
前台js对象在后台转化java对象的问题探讨
2013/12/20 Javascript
javascript解析json数据的3种方式
2014/05/08 Javascript
jquery实现类似EasyUI的页面布局可改变左右的宽度
2020/09/12 Javascript
jQuery修改li下的样式以及li下的img的src的值的方法
2014/11/02 Javascript
使用jQuery获取data-的自定义属性
2015/11/10 Javascript
Javascript获取统一管理的提示语(message)
2016/02/03 Javascript
JavaScript动态添加事件之事件委托
2016/07/12 Javascript
vue.js中指令Directives详解
2017/03/20 Javascript
JS鼠标滚动分页效果示例
2017/07/05 Javascript
原生js+cookie实现购物车功能的方法分析
2017/12/21 Javascript
vue-cli 如何打包上线的方法示例
2018/05/08 Javascript
Node.js搭建WEB服务器的示例代码
2018/08/15 Javascript
layer.confirm取消按钮绑定事件的方法
2018/08/17 Javascript
element ui table(表格)实现点击一行展开功能
2018/12/04 Javascript
基于Vue和Element-Ui搭建项目的方法
2019/09/06 Javascript
微信小程序选择图片控件
2021/01/19 Javascript
python cookielib 登录人人网的实现代码
2012/12/19 Python
python中numpy的矩阵、多维数组的用法
2018/02/05 Python
DRF跨域后端解决之django-cors-headers的使用
2019/01/27 Python
python使用Plotly绘图工具绘制柱状图
2019/04/01 Python
基于python实现雪花算法过程详解
2019/11/16 Python
Python笔记之代理模式
2019/11/20 Python
在keras下实现多个模型的融合方式
2020/05/23 Python
美国社交购物市场:MassGenie
2019/02/18 全球购物
保安自我鉴定范文
2013/12/08 职场文书
车辆工程专业求职信
2014/04/28 职场文书
解除财产保全担保书
2014/05/20 职场文书
普通党员自我剖析材料
2014/10/07 职场文书
工程竣工验收申请报告
2015/05/15 职场文书
《遗弃》开发商删推文要跑路?官方回应:还在开发
2022/04/03 其他游戏
Android Rxjava3 使用场景详解
2022/04/07 Java/Android
python模板入门教程之flask Jinja
2022/04/11 Python
Golang bufio详细讲解
2022/04/21 Golang
Debian11 Xfce终端光标的颜色怎么设置?
2022/08/14 数码科技