我正在编写一个简单的应用程序来显示(只读)员工信息。我想只从JSON加载一次信息。不确定角度工厂的惯例是什么。
我知道一个解决方案是将jSON文件放在javascript文件中并将其加载为js文件(但我希望将文件保留为JSON)。
我想我也可以将http调用包装在一个promise中,并相应地更改返回值。
有没有办法在不改变回报的情况下这样做?阻止员工负担?
.factory('Employees', ['$http', function($http) {
var employees = $http.get('res/employees.json').then(function(response){
return response.data; // This is async so won't return right away
});
// This way works (since not async)
// var employees = [
// {
// "id": 232,
// "name": "Bob"
// }];
return {
all: function() {
return employees; // This will return empty before employees is loaded
}
}
}]);
答案 0 :(得分:4)
这是promise模式的错误实现。您的“员工”服务应返回已初始化的承诺,然后在后续请求时返回相同的已解决承诺。像这样:
.factory('Employees', ['$q', '$http', function($q, $http) {
var _deferred = $q.defer();
$http.get('res/employees.json')
.success(function(data, status, headers, config) {
// this callback will be called asynchronously
// when the response is available
_deferred.resolve(data);
})
.error(function(data, status, headers, config) {
// called asynchronously if an error occurs
// or server returns response with an error status.
_deferred.reject("Error");
});
};
return {
getEmployees: function(){
return _deferred.promise;
}
}
}]);
.controller('MyController', ['$scope', 'Employees', function($scope, Employees) {
$scope.employees = [];
$scope.employees = Employees.getEmployees();
}]);
$ scope.employees最初将是一个空数组,直到解析了promise。此外,此代码没有错误恢复。
答案 1 :(得分:1)
可能适用于您的一种可能解决方案是使用附加的value
或service
获取的数据来获取数据和 manually bootstrap 您的应用程序。已经为此类问题构建了解决方案,一个称为angular-deferred-bootstrap
,另一个是我一个月前制作的 solution 。两者都在使用angular.bootstrap()
手动引导应用程序时使用AngularJS生命周期。请注意,当您手动引导应用程序时,需要删除ng-app
指令。