今天给大家介绍一下AngularJS系列之select下拉选择第一个选项为空白的解决办法。
相信大家也经常遇到这种情况吧：在使用AngularJS中的select组件开发的时候，莫名其妙的第一个选项就变成空白了，而且选中其中非空白的地方，第一个选项的空白位置又奇妙的消失了。
今天就举几个例子给大家介绍一下种种情况的处理办法，下面首先给出一个具体例子介绍一下：
- <!DOCTYPEhtml>
- <html>
- headMetacharset="utf-8"scriptsrc="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></scriptbodydivng-app="myApp"ng-controller="myCtrl"p>选择网站:selectng-model="selectedSite"optionvalue="">请选择option>
- optionng-repeat="xinsites"value="{{x.url}}">{{x.site}}selecth1>你选择的是:{{selectedSite}}div varapp=angular.module('myApp',[]);
- app.controller('myCtrl',function($scope){
- $scope.sites=[
- {site:"Google",url:"http://www.google.com"},
- {site:"Runoob",url:"http://www.runoob.com"},
- {site:"Taobao",url:"http://www.taobao.com"}
- ];
- });
- >该实例演示了使用ng-repeat指令来创建下拉列表，选中的值是一个字符串。>
第一种办法就是在select的下面加上一个默认option，不过有一点必须特别注意，就是在option中的value值必须设置为“”（也就是空字符串），否则上面第一个选项还是会留空白出来。
这样可能就会有人说我第一个option要是不想获取的value值为空，那该怎么办，比如我第一个value值想设置成“请选择”这个字符串呢？
这种情况也好解决，下面看一下下面这个例子，大家就会明白要怎么做了。
copy
