我有一个使用 Angular 1.5 构建的应用程序,其中以下代码工作正常:
<div class="select-wrapper">
<select ng-model="myModel"
ng-options="thing as thing for (thing, otherThing) in sortedThings">
<option value="">MAKE SELECTION</option>
</select>
<i class="fa fa-angle-down" title="Select Arrow"></i>
</div>
但是,当我升级到 Angular 1.6 时,此代码不再在选择框中显示默认选项(进行选择(。
为什么会发生这种情况以及如何解决?
编辑:我想看到的是,当我第一次加载页面时,下拉菜单应该已经选择了"进行选择"。
将模型设置为默认选项时,使用值undefined
非常重要。将模型设置为空字符串""
不起作用。
angular.module('defaultSelectValue', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.data = {
sortedThings: {
a: 'fred',
b: 'narf',
},
selectedOption: undefined //This sets the default value of the select in the ui
};
$scope.s2 = {
selectedOption: "" //setting to empty string won't work
}
}]);
<script src="//unpkg.com/angular/angular.js"></script>
<body ng-app="defaultSelectValue" ng-controller="ExampleController">
<select
ng-options="key as key for (key, value) in data.sortedThings"
ng-model="data.selectedOption">
<option value="">MAKE SELECTION</option>
</select>
<br>
<tt>option = {{data.selectedOption}}</tt><br/>
<hr>
Empty string doesn't work<br>
<select
ng-options="key as key for (key, value) in data.sortedThings"
ng-model="s2.selectedOption">
<option value="">MAKE SELECTION</option>
</select>
<br>
<tt>option = {{s2.selectedOption}}</tt>
</body>