AngularJS-选择带有ajax源的空选项 [英] AngularJS - Empty option in select with ajax source
本文介绍了AngularJS-选择带有ajax源的空选项的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我有一个select元素,其中应该填充一些我需要从API调用中检索的选项,然后将第一个选项设置为selected.
I have a select element that should be filled with some options that I need to retrieve from an API call, then set the first one as selected.
但是Angular在第一个位置创建了一个空选项,我不知道如何删除它.
But Angular creates an empty option at first position and I don't know how to delete it.
这是我的代码:
HTML
<select class="form-control" ng-model="selectedPositionFamily">
<option ng-repeat="pf in positionFamilies" ng-value="pf.uuid">{{pf.name}}</option>
</select>
控制器
function Controller($scope, PositionFamilyService) {
$scope.positionFamilies = [];
$scope.selectedPositionFamily = "";
initController();
function initController() {
PositionFamilyService.getAll({ 'sort' : 'order,asc' })
.then(function(data){
$scope.positionFamilies = data.content;
$scope.selectedPositionFamily = $scope.positionFamilies[0].uuid;
});
}
}
推荐答案
使用ng-options可以实现相同的目的
Same thing can be achieved using ng-options
html
<select ng-model="selectedPositionFamily"
ng-options="pf.uuid as pf.name for pf in positionFamilies"></select>
js
$scope.positionFamilies = [{uuid:1, name:"val1"},
{uuid:2, name:"val2"},{uuid:3, name:"val3"}];
$scope.selectedPositionFamily = $scope.positionFamilies[0].uuid;
https://jsfiddle.net/mxno5esv/
这篇关于AngularJS-选择带有ajax源的空选项的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文