angularJS--ngSelect
给select绑定ng-model时,经常会出现首选第一个option值是undefined。如图,

源代码
<select ng-model="newSupplier.companytype">
<option value="A">A类货源供应商</option>
<option value="B" ng-selected="newSupplier.companytype=='B'">B类货源供应商</option>
</select>
主要原因是:ng-model绑定的值“newSupplier.companytype”没有初始值。浏览器自动解析为undefined。
浏览器解析代码:
<select ng-model="newSupplier.companytype" class="ng-pristine ng-valid">
<option value="? undefined:undefined ?"></option>
<option value="A">A类货源供应商</option>
<option value="B" ng-selected="newSupplier.companytype=='B'">B类货源供应商</option>
</select>
解决办法:
只要在js文件中,初始化ng-model所绑定的值即可。
$scope.newSupplier.companytype='B';
另外,ng-selected可以帮助自动指定默认选中项。
关于ng-selected和ng-option以及ng-repeat,待补充。
angularJS--ngSelect的更多相关文章
- angularjs: ng-select和ng-options
angular.js有一个很强大的指令: ng-select 它可以帮助你通过数据模型来创建select元素.它很好的支持了select标签的语法,但是却有点坑. 假设有如下一段json数据: { & ...
- angularjs ng-select ng-options 默认选中项.
<!DOCTYPE html> <html ng-app="myApp"> <head> <meta charset="utf- ...
- [Angularjs]系列——学习与实践
写在前面 这个系列是来这家公司到现在,边用边学,以及在工作中遇到的问题进行的总结.深入的东西不多,大多是实际开发中用到的东西. 这里做一个目录,方便查看. 系列文章 [Angularjs]ng-sel ...
- [Angularjs]视图和路由(四)
写在前面 关于angularjs的路由的概念基本上这篇就要结束了,通过学习,以及在实际项目中的实践,还是比较容易上手的.自己也通过angularjs做了一个在app上的一个模块,效果还是可以的. 系列 ...
- [Angularjs]ng-show和ng-hide
写在前面 上篇文章介绍了ng-select和ng-options指令的使用,这篇文章继续指令的学习,本篇文章讲学习ng-show和ng-hide指令. 系列文章 [Angularjs]ng-selec ...
- [Angularjs]视图和路由(一)
写在前面 对单页应用来讲,视图和路由的作用可以从一个视图跳转到另外一个视图,可以合理管理用户在使用过程中看到的界面. 将视图分解成布局和模版视图,并且根据用户当前访问的URL来展示对应的视图,将会是一 ...
- [Angularjs]视图和路由(二)
写在前面 上篇文章主要介绍了视图和路由的基本概念,并在文章最后举了一个简单的使用案例.这篇文章将继续学习路由的配置,及相关参数的说明. 系列文章 [Angularjs]ng-select和ng-opt ...
- [Angularjs]视图和路由(三)
写在前面 上篇文章主要介绍了路由中when方法的第二个参数,常见的几个属性,以及作用.本篇文章,将介绍和路由相关的几个常见的服务. 系列文章 [Angularjs]ng-select和ng-optio ...
- [Angularjs]ng-class,ng-class-even,ng-class-odd
写在前面 最近在通过angularjs将数据绑定到前端,其中也涉及到很多新的东西,一些效果还是很有必要实现的.在使用中发现ng-class,ng-class-even.ng-class-odd的使用, ...
- [Angularjs]单页应用之分页
写在前面 在项目中,用到单页应用的分页,当时想到使用滚动加载的方案,可是几次尝试都没配置成功,闲着无聊就弄了一个demo. 系列文章 [Angularjs]ng-select和ng-options [ ...
随机推荐
- Windows动态库学习心得
最近在工作中需要给项目组其他成员提供调用函数,决心抛弃以前“拷贝头文件/源文件”的简陋方法,采用动态库的方式对自己开发的接口进行模块化管理.因之前一直没有机会从事Windows动态库的开发,现借助这个 ...
- C/C++二维数组分配内存
//C++方式 double **Q=new double*[row]; //初始化Q矩阵 for(int i=0;i<row;++i) Q[i]=new double[POS_NUM]( ...
- Chrome插件概览(一) – The basics
转载http://lvjava.com/?p=582 原文见https://developer.chrome.com/extensions/overview.html Chrome Extension ...
- Maven构建项目后项目报Error错误Java compiler level does not match the version of the installed Java project fac
项目->右键->Project Facets->修改facets中Java版本(下拉箭头出)为要用的版本 Maven构建项目需注意 1.项目右键->Preferences-&g ...
- awk 命令
awk是一个强大的文本分析工具,相对于grep的查找,sed的编辑,awk在其对数据分析并生成报告时,显得尤为强大.简单来说awk就是把文件逐行的读入,以空格为默认分隔符将每行切片,切开的部分再进行各 ...
- CentOS 6下Apache的https虚拟主机实践
题目:1.建立httpd服务器,要求: 提供两个基于名称的虚拟主机: (a)www1.buybybuy.com,页面文件目录为/web/vhosts/www1:错误日志为/var/log/httpd/ ...
- switch能使用的数据类型有6种
byte.short.char.int.String.枚举
- SELinux查看、启用、关闭
SELinux查看.启用.关闭 查看SELinux状态: 1./usr/sbin/sestatus -v ##如果SELinux status参数为enabled即为开启状态 SELinux ...
- hibernate 注解 主键生成策略
一.JPA通用策略生成器 通过annotation来映射hibernate实体的,基于annotation的hibernate主键标识为@Id, 其生成规则由@GeneratedValue ...
- 如何在java中拟合正态分布
前言 最近在工作中需要拟合高斯曲线,在python中可以使用 scipy,相关代码如下: #!/usr/bin/env python # -*- coding=utf-8 -*- %matplotli ...