Question

我有一种情况，我从函数返回一个promise，它成为$q.all数组的一部分。这适用于页面加载。我的问题是我需要在此之后多次调用此函数来使用新数据更新视图。

这是我的工作代码：

var vm = this;
var loadingGames = $q.defer();
var loadingPlayers = $q.defer();

var getGames = function() {
  playersService.getGames({
    playerId: playerId
  }).$promise.then(function(data) {
    vm.games = data;
    loadingGames.resolve();
  });
};

var getPlayers = function() {
  playersService.getPlayers({
    playerId: playerId
  }).$promise.then(function(data) {
    vm.players = data;
    loadingPlayers.resolve();
  });
};

$q.all([loadingGames.promise, loadingPlayers.promise]).then(function() {
  populateOptions(vm.games);
  vm.tableParams.reload();
});

var init = function() {
  getGames();
  getPlayers();
}

init();

这显然不起作用，loadingGames已在页面加载时得到解决，因此我将永远不会依赖它来获取更新数据：

var updateStatus = function() {
  getGames();
  loadingGames.promise.then(function() {
    populateOptions(vm.games);
    vm.tableParams.reload();
  });
};

这是我的下一次尝试，但它也不起作用，因为当我尝试TypeError: Cannot read property 'then' of undefined时，我在控制台中得到updateStatus：

var updateStatus = function() {
  getGames().then(function() {
    populateOptions(vm.games);
    vm.tableParams.reload();
  });
};

如何解决getGames()的未来承诺，以便updateStatus()收到更新的数据？

更新：使用回调再次拍摄，但没有骰子。回调中的函数永远不会被调用。

var updateStatus = function() {
  getGames(function() {
    populateOptions(vm.games);
    vm.tableParams.reload();
  });
};

Answer 1

你必须在你的函数中使用 $ q.defer（），你应该返回 promise 。然后，您可以轻松地将这些承诺结合起来。

我用Service和Controller编写了一个例子。

<强>服务

(function(){

  function Service($q){

    var games = ['zelda', 'mario'];

    var players = ['john', 'Donkey kong'];

    function getGames(){
      return $q(function(resolve){
        resolve(games);
      });
    }

    function getPlayers(){
      return $q(function(resolve){
        resolve(players);
      });
    }

    function addGames(name){
      games.push(name);
    }

    function addPlayers(name){
      players.push(name);
    }

    return {
      getGames: getGames,
      getPlayers: getPlayers,
      addGames: addGames,
      addPlayers: addPlayers
    }

  }

  angular
    .module('app')
    .factory('Service', Service);

})();

<强>控制器

(function(){

function Controller($scope, $q, Service) {

  var vm = this;

  var getGames = function(){

    var defer = $q.defer();

    Service.getGames().then(function(response){
      defer.resolve(response);
    });
    //Return promise
    return defer.promise;

  }

  var getPlayers = function(){

    var defer = $q.defer();

    Service.getPlayers().then(function(response){
      defer.resolve(response);
    });

    return defer.promise;

  }

  var updateStatus = function() {
    //Add games to simulate change
    Service.addGames('Skyrim');

    getGames().then(function(response){
      //Log games array
      console.log('Data updated !');
      console.log(response);
    });
  };

  var promise1 = Service.getGames();
  var promise2 = Service.getPlayers();

  $q.all([promise1, promise2]).then(function(response){
    var games = response[0];
    var players = response[1];
    console.log('first');
    console.log(games);
    updateStatus();
  });



}

angular
.module('app', [])
.controller('ctrl', Controller);

})();

现在，您getGames()和getPlayers()函数将返回承诺。

从同一函数返回不同的承诺

1 个答案: