角度js选择框首先出现空选项

时间:2017-05-17 09:57:43

标签: javascript html angularjs select

我正在使用angular 1.6.4我想在选择框中显示年龄因此从控制器获取值,我使用下面的代码,但第一个字段将变空?请帮我解决一下

  <select ng-model="agefrom" name="agefrom" id="agefrom" class="select" style="width: 45%">
    <option ng-repeat="age in ages" ng-value="age">{{age}}</option>
  </select>

2 个答案:

答案 0 :(得分:1)

第一个选项为空,因为您没有选择ngModel。为ngModel添加值,并使用ng-options代替ng-repeat

&#13;
&#13;
angular.module("app",[])
.controller("ctrl",function($scope){
$scope.ages = [2,3,4];

$scope.agefrom = $scope.ages[0]

})
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="ctrl">
 <select ng-model="agefrom" name="agefrom" id="agefrom" class="select" style="width: 45%" ng-options="age as age for age in ages"> 
 </select>
</div>
&#13;
&#13;
&#13;

答案 1 :(得分:0)

你可以像这样使用ng-init

<select ng-init="agefrom = ages[0]" 
    ng-model="agefrom" 
    name="agefrom" id="agefrom" class="select" 
    style="width: 45%">
    <option ng-repeat="age in ages" ng-value="age">{{age}}</option>
</select>