给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的更多相关文章

  1. angularjs: ng-select和ng-options

    angular.js有一个很强大的指令: ng-select 它可以帮助你通过数据模型来创建select元素.它很好的支持了select标签的语法,但是却有点坑. 假设有如下一段json数据: { & ...

  2. angularjs ng-select ng-options 默认选中项.

    <!DOCTYPE html> <html ng-app="myApp"> <head> <meta charset="utf- ...

  3. [Angularjs]系列——学习与实践

    写在前面 这个系列是来这家公司到现在,边用边学,以及在工作中遇到的问题进行的总结.深入的东西不多,大多是实际开发中用到的东西. 这里做一个目录,方便查看. 系列文章 [Angularjs]ng-sel ...

  4. [Angularjs]视图和路由(四)

    写在前面 关于angularjs的路由的概念基本上这篇就要结束了,通过学习,以及在实际项目中的实践,还是比较容易上手的.自己也通过angularjs做了一个在app上的一个模块,效果还是可以的. 系列 ...

  5. [Angularjs]ng-show和ng-hide

    写在前面 上篇文章介绍了ng-select和ng-options指令的使用,这篇文章继续指令的学习,本篇文章讲学习ng-show和ng-hide指令. 系列文章 [Angularjs]ng-selec ...

  6. [Angularjs]视图和路由(一)

    写在前面 对单页应用来讲,视图和路由的作用可以从一个视图跳转到另外一个视图,可以合理管理用户在使用过程中看到的界面. 将视图分解成布局和模版视图,并且根据用户当前访问的URL来展示对应的视图,将会是一 ...

  7. [Angularjs]视图和路由(二)

    写在前面 上篇文章主要介绍了视图和路由的基本概念,并在文章最后举了一个简单的使用案例.这篇文章将继续学习路由的配置,及相关参数的说明. 系列文章 [Angularjs]ng-select和ng-opt ...

  8. [Angularjs]视图和路由(三)

    写在前面 上篇文章主要介绍了路由中when方法的第二个参数,常见的几个属性,以及作用.本篇文章,将介绍和路由相关的几个常见的服务. 系列文章 [Angularjs]ng-select和ng-optio ...

  9. [Angularjs]ng-class,ng-class-even,ng-class-odd

    写在前面 最近在通过angularjs将数据绑定到前端,其中也涉及到很多新的东西,一些效果还是很有必要实现的.在使用中发现ng-class,ng-class-even.ng-class-odd的使用, ...

  10. [Angularjs]单页应用之分页

    写在前面 在项目中,用到单页应用的分页,当时想到使用滚动加载的方案,可是几次尝试都没配置成功,闲着无聊就弄了一个demo. 系列文章 [Angularjs]ng-select和ng-options [ ...

随机推荐

  1. Ubuntu16.04 apache2 wsgi 部署django

    在Ubuntu16.04上部署django其实还算简单直观,最重要的问题就是路径设置正确,并且保证版本统一,这个测试是在 Apache/2.4.18 (Ubuntu)  apt-get install ...

  2. 服务器RAS性能

    服务器的安全性能要求非常高,主要体现在RAS性能上.RAS性能指的是机器的可靠性(Reliability).可用性(Availability)和可服务性(Serviceability).RAS能力主要 ...

  3. Geodatabase数据模型

    1  Geodatabase概念 Geodatabase是ArcInfo8引入的一种全新的面向对象的空间数据模型,是建立在DBMS之上的统一的.智能的空间数据模型.“统一”是指,Geodatabase ...

  4. spring mvc1

    DispatcherServlet是前端控制器设计模式的实现,提供Spring Web MVC的集中访问点,而且负责职责的分派,而且与Spring IoC容器无缝集成,从而可以获得Spring的所有好 ...

  5. 【原创】loadrunner12.53 录制脚本时 打不开网页或者打开网页慢?

          问题描述: 之前刚装12.5版本时候,用 WebTours测试过,应用程序选择自己本地IE浏览器.exe程序,输入url地址就可以成功录制了 . 但是由于公司网络配置环境改变了(猜测),现 ...

  6. ThinkPad W520 在 Windows Server 2012 / R2 中安装驱动

    1.安装Intel Chipset Device Software (INF Update Utility).2.安装ThinkPad ACPI电源管理驱动.3.安装电源管理软件.4.安装英特尔核芯显 ...

  7. js监听浏览器,关闭,刷新

    //浏览器关闭或刷新事件 function bindCloseBrowser() { var a = "注意!!\n您即将离开页面!离开后可能会导致数据丢失\n\n您确定要离开吗?" ...

  8. RandomAccessFile使用小结

    本文是基于Linux环境运行,读者阅读前需要具备一定Linux知识 RandomAccessFile是Java输入/输出流体系中功能最丰富的文件内容访问类,既可以读取文件内容,也可以向文件输出数据.与 ...

  9. ios硬件编码

    video-videoToolbox: http://www.cnblogs.com/sunminmin/p/4976418.html audio-AudioToolbox: http://blog. ...

  10. tracert与pathping

    trace route(windows命令为tracert,Linux命令为traceroute)命令可以列出本地计算机与目标计算机之间所有经过的计算机信息.可以输入目标计算机的名字(如www.bai ...