Javascript 如何在 ng-options 中设置默认值
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/33993468/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to set default value in ng-options
提问by mpsbhat
I can set a dropdown list with default value in angularjs as,
我可以在 angularjs 中设置一个带有默认值的下拉列表，
<select name="repeatSelect" id="repeatSelect" ng-model="repeatSelect" ng-init=" repeatSelect = data[0].id">
<option ng-repeat="option in data" value="{{option.id}}">{{option.name}}</option>
</select>
How can I achieve the same using ng-options? I treid with,
我怎样才能实现相同的使用ng-options？我试过，
<select name="repeatSelect"
id="repeatSelect"
ng-model="repeatSelect"
ng-init=" repeatSelect = option.id"
ng-options="option.name for option in data track by option.id">
</select>
But no use. Sample fiddle is here
但是没有用。样品小提琴在这里
回答by Upal Roy
回答by ste2425
All this miss use of ng-init.
所有这些都错过了使用ng-init.
From the angular docs:
从角度文档：
This directive can be abused to add unnecessary amounts of logic into your templates. There are only a few appropriate uses of ngInit, such as for aliasing special properties of ngRepeat, as seen in the demo below; and for injecting data via server side scripting. Besides these few cases, you should use controllers rather than ngInit to initialize values on a scope.
可以滥用此指令将不必要的逻辑量添加到您的模板中。ngInit 只有几个合适的用途，例如为 ngRepeat 的特殊属性设置别名，如下面的演示所示；以及通过服务器端脚本注入数据。除了这几种情况之外，您应该使用控制器而不是 ngInit 来初始化范围上的值。
In my opinion the correct way to set a default value is to simply pre-fill your ng-modelproperty with the value selected from your ng-options, angular does the rest.
在我看来，设置默认值的正确方法是简单地ng-model使用从您的 中选择的值预先填充您的属性，ng-options其余的由angular 完成。
Essentially when you define the $scopeproperty your select will bind to assign it the default value from your dataarray. If your dataarray is from an ajax request, just assign it once you have the data.
本质上，当您定义$scope属性时，您的选择将绑定以将data数组中的默认值分配给它。如果您的data数组来自 ajax 请求，只需在获得data.
.controller('test', ['$scope', function ($scope) {
$scope.data = [{name: 'one', id: 1}, {name: 'two', id: 2},{name: 'three', id: 3}];
$scope.repeatSelect= $scope.data[0];
}]);
There is one caveat to note. If you employ the askey word in your expression you have to assign your ng-modelwith the actual property your telling it to select.
有一个警告需要注意。如果您as在表达式中使用关键字，则必须将ng-model您告诉它选择的实际属性分配给您。
See full fiddle demoing both: http://jsfiddle.net/kb99gee8/
查看完整的小提琴演示：http: //jsfiddle.net/kb99gee8/
回答by Manoj Salvi
i have acheieved what you need using your code and ng-optionslike you mentioned, here is Working Fiddle
我已经使用你的代码实现了你需要的东西，ng-options就像你提到的，这里是工作小提琴
Full CODE
完整代码
<div ng-app="ngrepeatSelect">
<div ng-controller="ExampleController">
<form name="myForm">
<label for="repeatSelect">Angular select:</label>
<select name="repeatSelect"
id="repeatSelect"
ng-model="repeatSelect"
ng-init=" repeatSelect = data[0]"
ng-options="option.name for option in data track by option.id">
</select>
</form>
<br/> <tt>Selected value: {{repeatSelect.id}}</tt>
</div>
</div>
<br/>
回答by athira renjan
I will suggest an example HTML part
我会建议一个示例 HTML 部分
<select class="form-control" ng-model="data.selectedOption" required ng-options="option.name as option.name for option in venueNamelists" ng-change="getmediationRooms(data.selectedOption)"></select>
In my controller
在我的控制器中
$scope.data = {selectedOption: $scope.venueNamelists[i].name};
$scope.data = {selectedOption: $scope.venueNamelists[i].name};
the model value should equal to the key,value pair in the venueNamelists.
模型值应等于venueNamelists 中的键值对。
