Question

我正在使用ng-repeat和$ loaded（）显示$ firebaseArray。但是，当该阵列开始变大时，它已开始减慢页面加载。

我正在发布我是如何构建这个的，所以如果您看到任何方法以不同方式执行此操作或优化过程，请告诉我。我很感激帮助。

在控制器中，我首先从Firebase获取一系列发票ID。我将这些ID发送到服务（InvoiceMethods），然后使用另一个服务（InvoiceData）为每个相应的ID提取发票。 InvoiceMethods，如果以前还没有，则提取该发票的公司信息。

我感谢大家的帮助！

控制器 -

var createModel = function(){

    // fn that contains any ways i want to filter the invoices
    var fn = function(invoice){
        return true;
    }

    InvoiceMethods.createModel($scope, invoiceTypeIds, fn);
}

invoiceTypeIds = $firebaseArray(ref.child('invoices').child('pending'));  
createModel();

在InvoiceMethods服务中

// creates a model given an array with company and invoice ids
createModel: function($scope, invoiceTypeIds, fn){

  // once arr has finished loading, then structure a local model with co and indiv invoice info
  invoiceTypeIds.$loaded().then(function(){
    $scope.loaded = true;

    // every el represents one company and all the invoices for that company
    invoiceTypeIds.forEach(function(el){

      var invoiceIds = [];

      // get the all the invoice ids for that specific co
      for (var key in el){
        if (key != '$id' && key != '$priority')             
          invoiceIds.push(el[key]);
      }

      // send the company id, array of invoice ids, and any filtering function to get the array of corresponding invoices
      InvoiceData.getIds(el.$id, invoiceIds, fn)

      .then(function(invoicesArr){  

        // remove any invoices that may show up as undefined
        var finalArr = removeUndefined(invoicesArr);

        // if there are any invoices remaining store them in the scope variable under that company id
        if (finalArr.length != 0){
          $scope.invoiceInfo[el.$id] = removeUndefined(invoicesArr);

          // pull the data on that company id, if we haven't already and store in scope variable
          CompanyData.getCo(el.$id).then(function(companyObj){
            if (!$scope.companyInfo[el.$id])
                $scope.companyInfo[el.$id] = companyObj;
          });

        }
      });      
    });
  });

}

最后，我们在服务InvoiceData中有getIds函数。这是实际获取发票对应ID的功能。它使用一个名为getInvoices（）的辅助函数。我已经在下面展示过了。

  getIds: function(companyId, invoiceId, fn){
    return getInvoices(companyId, invoiceId, fn);
  }

辅助函数getInvoices（）

var getInvoices = function(companyId, invoiceId, fn){
  var promises = [];

  if (invoiceId.constructor == Array){

    invoiceId.forEach(function(el){
        promises.push(search(companyId, el, fn));
    });

    return $q.all(promises);
  }

  else {
    invoiceObj = $firebaseObject(ref.child('invoices').child('originals').child(companyId).child(invoiceId));

    var r = invoiceObj.$loaded().then(function(){
      return invoiceObj;
    });

    return r; 
  }
}

$ firebaseArray缓慢加载

0 个答案: