Angular 工厂不是 return 对象数组而是单个对象

Angular factory does not return array of objects but a single object

我是 angular 的新手,我正在尝试在工厂中加载 CSV 列表,然后将其转换为 json。我在工厂内部使用 Papaparse(CSV 到 json 库)。当我控制台登录工厂时,我得到了对象数组,这正是我想要的,但是当我将它传递到我的控制器中时,我得到了一个包含所有数据的对象。

这是我的工厂

(function() {

  var app = angular.module('test');

  app.factory('testFactory', ['$http', function($http) {

    var url = 'my-list.csv';

    var getContact = function() {

        return $http.get(url).success(function(data) {
            Papa.parse(data, {
                header: true,
                complete: function(results) {
                    console.log(results.data);
                    return results.data;
                }
            });
        });
      };

      return {
        getContact: getContact
      };
  }]);
}());

这是我的控制器

(function() {

  var app = angular.module('test');

  app.controller('testCtrl', ['$scope', 'testFactory', function($scope, testFactory) {

    testFactory.getContact().then(function(data) {
         $scope.contacts = data;
         console.log(data);
     });
     
  }]);

}());

我希望能够在我的视图中做这样的事情

{{ contact.firstname }}

问题是解决的顺序。检查控制台语句表明您正在将 $scope.contacts 分配给 $http.get 承诺的解析,而不是实际的解析。

而不是 returning $http.get 承诺,return 延迟承诺并在解析结束时解决:

var parsePromise = $q.defer();
$http.get(url).success(function(data) {
    Papa.parse(data, {
        header: true,
        complete: function(results) {
            console.log(results.data);
            parsePromise.resolve(results.data);
        }
    });
});
return parsePromise.promise;

查看工作演示 here

更新:根据评论,您可以使用 .then 链接承诺而不是创建新的 deferred。 plunkr 两者都有,您可以使用更改日志来切换方法。