javascript - Angular 工厂约定中的一次异步数据加载？

Question

我正在编写一个简单的应用程序来显示(只读)员工信息。我只想从 JSON 加载一次信息。不确定 Angular 工厂中围绕此的约定是什么。

我知道一种解决方案是将 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
    }
  }
}]);

Answer 1

这是 promise 模式的错误实现。您的“员工”服务也应返回一个已初始化的 promise ，然后在后续请求时返回相同的已解决 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 得到解决。此外，此代码没有错误恢复。