Select 仅当 Angular 从资源对象中检索数据时的选项元素

Question

我正在尝试加载 select html 元素中的对象列表。问题是在数据实际从服务器返回之前编译代码。因此，我想在 select 元素中 selected 的选项没有被 selected。我该如何解决这个问题？

我有以下 HTML:

<select ng-options="location.name for location in locations" ng-model="selectedOption" />

控制器代码：

$scope.locations = data.locations.getAll();
$scope.selectedOption = $scope.locations[1];

数据服务调用 RESTful 服务：

app.factory('data', function($resource) {
    var locationsResource = $resource('http://localhost:10128/api/locations/:id', {id: '@id'});

    return {
        locations: {
            getAll: function() {
                return locationsResource.query();
            }
        }
   }
});

Answer 1

您需要使用 $resource 的 $promise，像这样：

$scope.locations = data.locations.getAll();
$scope.locations.$promise.then(function (result) {
    $scope.selectedOption = result[1];
});

你也可以在.then()之后添加一个错误处理函数。

下面是 promises in AngularJS 工作原理的一个很好的例子。

Select 仅当 Angular 从资源对象中检索数据时的选项元素

Select an option element only when Angular retrieves the data from a resource object

javascript

rest

angularjs

angular-resource