关于angularjs:Angular HttpPromise:`success` /`error`方法和`then`的参数之间的区别

Angular HttpPromise: difference between `success`/`error` methods and `then`'s arguments

根据AngularJS doc,对$http的调用返回以下内容:

Returns a promise object with the standard then method and two http specific methods: success and error. The then method takes two arguments a success and an error callback which will be called with a response object. The success and error methods take a single argument - a function that will be called when the request succeeds or fails respectively. The arguments passed into these functions are destructured representation of the response object passed into the then method.

除了response对象在一种情况下被解构的事实之外,我没有区别

  • 传递的成功/错误回调作为promise.then的参数传递
  • 回调作为promise的promise.success / promise.error方法的参数传递

有没有? 这两种不同方式通过看似相同的回调有什么意义?


这里有一些很好的答案。但是,将并行性的差异推向家庭是值得的:

  • success()返回原始承诺
  • then()返回新的承诺

区别在于then()驱动顺序操作,因为每次调用都会返回一个新的promise。

1
2
3
$http.get(/*...*/).
  then(function seqFunc1(response){/*...*/}).
  then(function seqFunc2(response){/*...*/})
  • $http.get()
  • seqFunc1()
  • seqFunc2()
  • success()驱动并行操作,因为处理程序链接在相同的承诺上。

    1
    2
    3
    $http(/*...*/).
      success(function parFunc1(data){/*...*/}).
      success(function parFunc2(data){/*...*/})
  • $http.get()
  • parFunc1()parFunc2()并行

  • NB这个答案事实上是不正确的;正如下面的评论所指出的,success()确实会返回原始的承诺。我不会改变;并将其留给OP进行编辑。

    2之间的主要区别在于.then()调用返回一个promise(使用从回调返回的值解析),而.success()是更传统的注册回调方式而不返回promise。

    基于承诺的回调(.then())可以轻松链接承诺(进行调用,解释结果然后再进行一次调用,解释结果,再做一次调用等)。

    当您不需要链接调用或使用promise API(例如,在路由中)时,.success()方法是一种简化的方便方法。

    简而言之:

    • .then() - promise API的全部功能,但稍微冗长
    • .success() - 不会返回承诺,但会提供稍微方便的语法


    简单GET请求的一些代码示例。也许这有助于理解差异。
    使用then

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    $http.get('/someURL').then(function(response) {
        var data = response.data,
            status = response.status,
            header = response.header,
            config = response.config;
        // success handler
    }, function(response) {
        var data = response.data,
            status = response.status,
            header = response.header,
            config = response.config;
        // error handler
    });

    使用success / error

    1
    2
    3
    4
    5
    $http.get('/someURL').success(function(data, status, header, config) {
        // success handler
    }).error(function(data, status, header, config) {
        // error handler
    });


    .then()是可链接的,将等待之前的.then()来解决。

    .success()和.error()可以链接,但它们都会立刻触发(所以没那么多)

    .success()和.error()非常适合简单的调用(简单的制作者):

    1
    2
    3
    $http.post('/getUser').success(function(user){
       ...
    })

    所以你不必输入这个:

    1
    2
    3
    $http.post('getUser').then(function(response){
      var user = response.data;
    })

    但通常我用.catch()处理所有错误:

    1
    2
    3
    4
    5
    6
    7
    8
    $http.get(...)
        .then(function(response){
          // successHandler
          // do some stuff
          return $http.get('/somethingelse') // get more data
        })
        .then(anotherSuccessHandler)
        .catch(errorHandler)

    如果你需要支持<= IE8,那么就像这样编写.catch()和.finally()(IE中的保留方法):

    1
    2
        .then(successHandler)
        ['catch'](errorHandler)

    工作实例:

    这是我用更多的编码格式编写的内容,用于刷新我的内存,了解它如何处理错误等:

    http://jsfiddle.net/nalberg/v95tekz2/


    只是为了完成,这是一个代表示例差异的代码示例:

    成功错误:

    1
    2
    3
    4
    5
    6
    7
    $http.get('/someURL')
    .success(function(data, status, header, config) {
        // success handler
    })
    .error(function(data, status, header, config) {
        // error handler
    });

    然后:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    $http.get('/someURL')
    .then(function(response) {
        // success handler
    }, function(response) {
        // error handler
    })
    .then(function(response) {
        // success handler
    }, function(response) {
        // error handler
    })
    .then(function(response) {
        // success handler
    }, function(response) {
        // error handler
    }).


    官方公告:已弃用成功与错误,请使用标准方法代替。

    Deprecation Notice:
    The $http legacy promise methods success and error have been deprecated. Use the standard then method instead. If
    $httpProvider.useLegacyPromiseExtensions is set to false then these
    methods will throw $http/legacy error.

    链接:https://code.angularjs.org/1.5.7/docs/api/ng/service/$http

    截图:查看截图