创建采用了棱角分明的工厂从火力访问多个数据点承诺 [英] Creating a promise for accessing multiple datapoints from firebase using angular factory

问题描述

我有一个工厂，获取ID的，我用它来从火力提取数据的数组。

1号是直接从火力点1个数据

我想创建一个工厂，返回解析火力对象的数组的承诺。

下面是一个工厂，做它一个数据点（从的解决方案如何角工厂使用火力地堡查询检索的例子吗？ ）

  // getLogo（）返回可以绑定到UI的承诺。
//当加载完成后，绑定将获得对手的标志值。
factory.getLogo =功能（opponentName）{
    VAR opponentsArray = $火力（_ref.orderByChild（'名'）equalTo（opponentName）。）$ asArray（）。    // $加载（）返回一个承诺，所以我们可以使用则（）方法添加
    //当数组完成加载，并承诺解决功能。
    变种R = opponentsArray。$（）加载，然后（函数（）{
        //现在返回标识为第一个匹配的对手
        返回opponentsArray [0] .logo;
    }）;    返回ř;
};
 

下面是我已经试过 -

 复位功能（arrIds）{
      VAR OBJ;
      VAR ARR = [];
      VAR CTR = 0;
      变种延迟= $ q.defer（）;      如果（arrIds.constructor ==阵列）{        对于（VAR I = 0; I＆LT; invoiceId.length;我++）{          OBJ = $ firebaseObject（ref.child（'发票'）子（本公司）子（arrIds [I]））;          OBJ。$（）加载，然后（函数（）{            arr.push（OBJ）;            如果（CTR === arrIds.length）{
              CTR ++;
              defer.resolve（ARR）;
              返回defer.promise;
            }          }）
        }      }
};
 

解决方案

您可以使用的 $ q.all 。我模拟使用 $超时一个异步请求，但下面的应该给你一个想法。

\r

\r

VAR应用= angular.module（'应用'，[]）;\r
\r
app.controller（'myController的'，函数（$范围，为myService）{\r
  myService.getAll（[1,2,3,4,5]），然后（功能（结果）{\r
    $ scope.results =结果;\r
  }）;\r
}）;\r
\r
app.service（'为myService'，函数（$ Q $超时）{\r
  this.getAll =功能（IDS）{\r
    VAR承诺= [];\r
    \r
    ids.forEach（函数（ID）{\r
      promises.push（getForId（ID））;\r
    }）;\r
    \r
    返回$ q.all（承诺）;\r
  };\r
  \r
  功能getForId（ID）{\r
    返回$超时（函数（）{\r
      回报'结果'+ ID;\r
    }，的Math.random（）* 2000）;\r
  }\r
}）;

\r

＆LT;脚本SRC =htt​​ps://cdnjs.cloudflare.com/ajax /libs/angular.js/1.4.3/angular.min.js\"></script>\r
＆LT; D​​IV NG-应用='应用'NG控制器='myController的'＆GT;\r
  ＆LT; pre＆GT; {{结果| JSON}}＆LT; / pre＆GT;\r
＆LT; / DIV＆GT;

\r

\r

\r

I have a factory that gets an array of ID's that I use to pull data from firebase.

1 ID pulls 1 piece of data from firebase

I want to create a factory that returns a promise that resolves an array of firebase objects.

Here's an example of a factory that does it for one datapoint (retrieved from the solution of How to use Firebase query in Angular factory?)

// getLogo() returns a promise that you can bind to the UI.
// When loading finishes, the binding will get the opponent's logo value.
factory.getLogo = function (opponentName) {
    var opponentsArray = $firebase(_ref.orderByChild('name').equalTo(opponentName)).$asArray();

    // $loaded() returns a promise, so we can use the then() method to add
    // functionality when the array finishes loading and the promise resolves.
    var r = opponentsArray.$loaded().then(function () {
        // Now return the logo for the first matching opponent
        return opponentsArray[0].logo;
    });

    return r;
};

Here's what I've tried -

return function(arrIds){
      var obj;
      var arr = [];
      var ctr = 0;
      var defer = $q.defer();

      if (arrIds.constructor == Array){

        for (var i = 0; i < invoiceId.length; i++){

          obj = $firebaseObject(ref.child('invoices').child('company').child(arrIds[i]));

          obj.$loaded().then(function(){

            arr.push(obj);

            if (ctr === arrIds.length){
              ctr++;
              defer.resolve(arr);
              return defer.promise;
            }

          })
        }

      }
};

解决方案

You can use $q.all. I simulated an async request using $timeout but the following should give you an idea.

var app = angular.module('app', []);

app.controller('myController', function($scope, myService) {
  myService.getAll([1,2,3,4,5]).then(function(results) {
    $scope.results = results;
  });
});

app.service('myService', function($q, $timeout) {
  this.getAll = function(ids) {
    var promises = [];
    
    ids.forEach(function(id) {
      promises.push(getForId(id));
    });
    
    return $q.all(promises);
  };
  
  function getForId(id) {
    return $timeout(function() {
      return 'Results for ' + id;
    }, Math.random() * 2000);
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.3/angular.min.js"></script>
<div ng-app='app' ng-controller='myController'>
  <pre>{{ results | json }}</pre>
</div>

这篇关于创建采用了棱角分明的工厂从火力访问多个数据点承诺的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！