在AngularJS'中返回数据$ q承诺

时间:2015-12-16 02:29:11

标签: angularjs angularjs-service angular-promise

我试图为http GET运行一个序列(一次,而不是并行)。考虑提交烹饪食谱,服务器只接受每个HTTP请求一步。他们必须按顺序发送,否则馅饼会变得一团糟。最后一步是唯一一个返回数据(一个热苹果派)。

我创建了一个Plunker http://plnkr.co/edit/yOJhhw?p=preview

我们将从控制器

开始
angular.module("app")
  .controller("sequencialCtrl", ["$scope", "seq", function($scope, seq) {

控制器以库文件表示的步骤列表开头,因此它们将花费0时间到d / l。

    var recipeSteps = [
      'http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js',
      'https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js',
      'https://ajax.googleapis.com/ajax/libs/angular_material/1.0.0/angular-material.min.js'
    ];

然后我创建一个inters范围变量来显示检索到的js文件的前80个字符,仅用于测试目的。

    $scope.inters = seq.intermediates;

然后我试着打电话给工厂提供的承诺。这在当时的控制台崩溃了

    // the console shows that seq.submitRecipe is undefined
    seq.submitRecipe.then(function(data) {
      $scope.results = data;
    });
  }]);

现在工厂

angular.module('app').factory('seq', function($http, $q) {

我们创建了中间体和submitRecipe

  var intermediates = ['test1', 'test2'];
  var submitRecipe = function(theSteps) {
    var deferredRecipe = $q.defer();
    var deferredPromise = deferredRecipe.promise;

    deferredPromise
      .then(function() {
        var deferred = $q.defer();
        var promise = deferred.promise;
        $http({
          method: 'GET',
          url: theSteps.shift()
        }).then(function(response) {
          intermediates.push( response.data.substr(0, 80) );
          deferred.resolve(response.data.substr(0, 80));
        });
        return promise;
      })
      .then(function() {
        var deferred = $q.defer();
        var promise = deferred.promise;
        $http({
          method: 'GET',
          url: theSteps.shift()
        }).then(function(response) {
          intermediates.push( response.data.substr(0, 80) );
          deferred.resolve(response.data.substr(0, 80));
        });
        return promise;
      })
      .then(function() {
        var deferred = $q.defer();
        var promise = deferred.promise;
        $http({
          method: 'GET',
          url: theSteps.shift()
        }).then(function(response) {
          intermediates.push( response.data.substr(0, 80) );
          deferred.resolve( "Apple Pie");
        });
        return promise;
      });

如前所述,我只想从最后一次返回数据,这是" Apple Pie"。

我们使用...

关闭submitRecipe功能
    // if this resolve isnt here, nothing is execute
    deferredRecipe.resolve();
    $rootScope.$apply();
    return deferredPromise;
  };

我发现,如果我没有那个决心(),那么then就不会运行。

最后我们揭露了我们工厂的方法。

  return {
    submitRecipe: submitRecipe,
    intermediates: intermediates
  };
});

在一天结束时,我希望$ scope.results成为" Apple Pie"。

感谢任何帮助。

1 个答案:

答案 0 :(得分:1)

这是工作plunkr

必须进行一些编辑:

submitRecipe是一个函数,因此您可以通过以下方式调用它:

seq.submitRecipe(recipeSteps).then(function(data) {
  $scope.results = data;
});

然后您可以删除不必要的$rootScope.$apply()

deferredRecipe.resolve();
// $rootScope.$apply();
return deferredPromise;