AngularJS：使用回调和承诺

Question

我无法围绕异步请求的概念包装我的大脑。

我有我的看法，这是从一个供应商创建一个对象实例的控制器：

va.controller('VaCtrl',function($scope,$shipment){ 
    $scope.shipment = $shipment.Shipment();  
}); 

提供者：

Shipment.provider('$shipment',function(){ 

    this.$get = function($http){ 

     function Shipment(){ 

     } 

     Shipment.prototype.fetchShipment = function(){ 
      var shipment = undefined; 
       $http.post('../sys/core/fetchShipment.php',{ 
         // some data to POST 
      }).then(function(promise){ 
        shipment = promise.data; 
       }); 

      return shipment; 
     }; 

     return { 
      Shipment: function(){ 
       return new Shipment(); 
      } 
     } 
    } 
}); 

我的目标是获得对数据的访问从我的控制器里面的Shipment.prototype.fetchShipment()。我的方法：

$scope.fetchShipment = function(){ 
     var shipment = $scope.shipment.fetchShipment(); 
     console.log(shipment); // undefined 
}; 

但是，这将返回undefined。

我读了关于$ q，并推迟，承诺和回调，现在我就像跆拳道;我想要做的就是将检索到的数据推送到我的控制器，这样做的最佳方式是什么？

Answer 1

您应该修改您的代码，如下所示，直接从fetchshipment返回承诺，然后在控制器中使用then（）。

Shipment.prototype.fetchShipment = function(){ 

    return $http.post('../sys/core/fetchShipment.php',{ 
     // some data to POST 
    }) 
}; 


$scope.fetchShipment = function(){ 
    var shipment = $scope.shipment.fetchShipment().then(function(data){; 
     console.log(data); 
    }); 
}; 

解读代码：

调用$ HTTP返回，当你从服务器获取数据，其解决的承诺。在上面的代码中，我已经从服务函数返回$ http.post返回一个承诺。因此，在控制器中，您正在等待承诺解决，并且在承诺解决后，结果将记录到控制台。

阅读上的角度更承诺文档：。

• http://docs.angularjs.org/api/ng $ Q
• http://docs.angularjs.org/api/ng $ HTTP

Answer 2

就在给你举个例子，如何让你的例子与自己的工作诺言。 它更简单，如果你使用$ HTTP内置的承诺，所以它是一个$ Q-例如：

angular.module('myApp', []).controller("myAppCtrl", function ($scope, $shipment) { 
    $shipment.Shipment().fetchShipment().then(function (shipment) { 
     $scope.shipment = shipment 
    }); 
}).provider('$shipment', function() { 
    this.$get = function ($http, $q) { 

     function Shipment() { 

     } 

     Shipment.prototype.fetchShipment = function() { 
      var defered = $q.defer(); 
      demodata = {name: "jan", id:8282}; 
      $http.post('/echo/json/', 'json=' + encodeURIComponent(angular.toJson(demodata)), { 
       headers: { 
        'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8' 
       } 
      }).then(function (response) { 
       //resolve promise 
       defered.resolve(response.data); 
      }); 

      return defered.promise; 
     }; 

     return { 
      Shipment: function() { 
       return new Shipment(); 
      } 
     } 
    } 
}); 

<div ng-controller="myAppCtrl">{{shipment}}</div> 

的jsfiddle（使用的jsfiddle回波服务为数据提供者）： http://jsfiddle.net/alfrescian/ayke2/

更多的承诺：

http://blog.parse.com/2013/01/29/whats-so-great-about-javascript-promises/ http://www.egghead.io/video/o84ryzNp36Q AngularJS : Where to use promises? stackoverflow.com/questions/15604196/... egghead.io/video/o84ryzNp36Q