angularjs 的select的option是通过循环造成的，循环的方式可能有 ng-option 或 者 <option ng-repeat></option>option中利用ng-repeat的指令但是传来的下拉列表总是第一行显示的是空的。
一、错误有空白
(一)、代码展示
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="https://cdn.bootcss.com/angular.js/1.4.6/angular.min.js"></script>
</head>
<body>
<style>
select{
width: 150px;
height: 30px;
}
</style>
<div ng-app="myApp" ng-controller="myCtrl">
<select ng-model="selectedName" ng-options="x for x in names">
</select>
</div>
<p>ng-options 指令的使用。</p>
</body>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.names = ["my", "dragon", "boke"];
});
</script>
(二)、浏览器展示
如上图展示下拉菜单给开发者获取select的value值带来很大的不便。 所以经过给select的ng-model一个默认的值，或者这样<option value="">请选择</option>这个样子的话，下拉列表里面那个空值就会变成请选择字样，就会去掉空白的option。如下
二、正确处理空白
(一)、代码展示
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="https://cdn.bootcss.com/angular.js/1.4.6/angular.min.js"></script>
</head>
<body>
<style>
select{
width: 150px;
height: 30px;
}
</style>
<div ng-app="myApp" ng-controller="myCtrl">
<select ng-init="selectedName = names[0]" ng-model="selectedName" ng-options="x for x in names">
</select>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.names = ["my", "dragon", "boke"];
});
</script>
<p>ng-options 指令的使用。</p>
</body>
</html>
(二)、浏览器展示
