如何在Angularjs的工厂中读取文件数组?

时间:2015-05-05 05:52:11

标签: javascript angularjs asynchronous angular-promise

我有一个文件数组。我想读取所有这些并从中制作一个json数组。问题是d3.csv是一个异步函数。

this问题开始,我已经知道必须使用$q.defer()来向控制器返回延期承诺。

我的问题是我必须读取一个文件数组并制作相应的对象数组。

以下是目前的代码:

myApp.factory('myFactory', function($q) {

  var masterData=[];

  var visFolder = "/data/";
  var files=[(visFolder + "Crime_full1.csv"),(visFolder + "accidents.csv"),(visFolder + "health.csv")];


  return {
      // Get all masterData
      get: function() {
        var deferred = $q.defer();

        //I want to read all the files in array 
        d3.csv(files[0], function(d) {
          masterData.push(d);
          deferred.resolve(masterData);
          console.log("a csv file read");
        });

        return deferred.promise;

      }

    }
  });


myApp.controller('visCtrl', function($scope, $routeParams,myFactory) {

  myFactory.get().then(function(masterData) {

    //masterdata should contain data of all the files in an array
    $scope.masterData = masterData;
  });

});

1 个答案:

答案 0 :(得分:1)

您必须迭代文件数组并调用为每个文件调用d3库的函数。这个函数应该返回promise。下面的getFile函数也是如此:

getFile = function (file) {
    var deferred = $q.defer();
    d3.csv(file, function (d) {
        deferred.resolve(d);
    });
    return deferred.promise;
}

getFile函数在返回块之外定义。现在必须更新get函数,以便为每个文件调用getFile,然后将结果与$q.all进行整理。代码看起来像这样。

get: function () {

    var promises = files.map(function (f) {
        return getFile(f);
    });

    return $q.all(promises).then(function (data) {
        data.forEach(function (f) {
            masterData.push(f);
        });
        return masterData;
    });
}