AngularJS:如何将我从工厂返回值,如果数据获取与HTTP [英] AngularJS : How would i return value from factory if the data is fetched with http

查看:273
本文介绍了AngularJS:如何将我从工厂返回值,如果数据获取与HTTP的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有这样的工厂角:

'use strict';

angular.module('finansiiApp')
  .factory('transactions', function ($http) {
    var transactions = [];
    $http.get("/api/transactions.json")
      .success(function(data, status){
        transactions = data;
      });

    // Public API here
    return {
      getTransactions: function () {
        return transactions;
      },
      addTransaction: function(transaction){
        transactions.push(transaction);
      }
    };
  });

这是我的控制器:

'use strict';

angular.module('finansiiApp')
  .controller('MainCtrl', function ($scope, transactions) {
    $scope.searchText = "";
    $scope.filterPrimanja = $scope.filterTrosoci = true;
    console.log(transactions);
    $scope.transactions = transactions.getTransactions();
    $scope.clicked = function(index){
      console.log(index);
    }
  });

现在,你可能已经猜到了,我在控制器的数据(这里我称之为getTransactions法)不更新成功。我将如何去使这项工作?

Now as you probably guessed, my data in the controller(where i call the getTransactions method) is not updated on success. How would i go about making this work?

推荐答案

有你可以改变一些东西。 (和方式,你可以改变它们)。 1是最推荐/正确的。

There are a few things you could change. (and ways you could change them). 1 being the most suggested/correct.


  1. 使用的承诺,回调在您的控制器等等...

  1. Use promises and callbacks in your controller so...

// your controller... ($scope.transactions line)
transactions.getTransactions().then(function(data){
    $scope.transactions = data;
}

// your service..
angular...factory('transactions',function($http,$q){
    var transactions = [];
    return {
        getTransactions: function(){
           //is a request needed?
           if(transactions.length > 0){
               var deferred = $q.defer();
               deferred.resolve(transactions);
               return deferred.promise;
           }
           return $http.get("/api/transactions.json").then(function(result){
               //modify collection of transactions...
               transactions = result.data;
               return transactions; // this is data ^^ in the controller
           });
        }
        addTransaction: function(transaction){
            //do more http stuff?
            //wrap function in promise so its consistent and will also run digest.
            var deferred = $q.defer();
            transactions.push(transaction);
            deferred.resolve(transactions);
            return deferred.promise;
        }
    }

});


  • 修改 VAR交易= []; ,而不是仅仅消灭它。例如。遍历秋冬新品的数据和推/流行不印字,CONCAT /角中势必需要Ë对象为幂等

  • Modify var transactions = []; instead of just wiping it out. eg. iterate over new data and push/pop unshift, concat w/e Objects bound in angular need to be idempotent

    要记住的另一件事是,服务实例化一次。当正在创建和销毁所有的时间控制器..你可能不必每次都作出这样的要求也许 getTransactions 返回$ HTTP的承诺,你可以检查是否之前你需要做的请求。然后手动使用的承诺。

    Another thing to keep in mind is that services are instantiated just once. While controllers are being created and destroyed all the time.. You might not have to make the request every time so perhaps before returning $http promise in getTransactions you could check to see if you need to make the request. Then manually use a promise.

    这篇关于AngularJS:如何将我从工厂返回值,如果数据获取与HTTP的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

  • 查看全文
    登录 关闭
    扫码关注1秒登录
    发送“验证码”获取 | 15天全站免登陆