链接两个$ http调用并返回第二个的结果

Question

我有一个Angular Service ，我想用来执行两个$http调用，并返回第二个的结果。 这是服务：

angular.module('myApp', [])
  .service('farm', ['$http']);

function farm($http) {
  this.saveFruit = function(fruit) {
    return $http.get('http://example.com/get-token').success(function(token) {
        return $http({
            method: 'POST',
            url: 'http://example.com/save-fruit',
            headers: { 'X-CSRF-Token': token },
            data: { fruit: fruit }
        });
    });
  }
}

此时，代码可以正常工作。 我能够“保存一些水果”，该水果通过GET为其自身GET令牌，然后通过POST发送数据，并且所有内容都保存在云中，很棒。

要调用此服务，我正在使用如下代码：

var fruit = { name: 'Apple', color: 'red' };
farm.saveFruit(fruit).success(function(result) {
    console.log(result);
});

但是， console.log()总是打印$http GET的结果，而不是POST 。

调用saveFruit时如何获得$http POST调用的结果？

Answer 1

使用$http的.success和.error方法会破坏诺言链。 这是未记录的，可以认为是错误。

为了继续承诺链，使用.then （和.catch ，如需要的话）。

return $http.get('http://example.com/get-token').then(function(response) {
    return $http({
        method: 'POST',
        url: 'http://example.com/save-fruit',
        headers: { 'X-CSRF-Token': response.data },
        data: { fruit: fruit }
    });
});

Answer 2

success()不允许链接诺言。 使用真实的东西： then() 。

return $http.get('http://example.com/get-token').then(function(response) {
  return $http({
    method: 'POST',
    url: 'http://example.com/save-fruit',
    headers: { 'X-CSRF-Token': response.data },
    data: { fruit: fruit }
  });
}).then(function(response) {
  return response.data;
});

和

var fruit = { name: 'Apple', color: 'red' };
farm.saveFruit(fruit).then(function(result) {
    console.log(result);
});