web-dev-qa-db-fra.com

Angular HttpPromise: différence entre les méthodes `success` /` error` et les arguments de `then`

Selon AngularJS doc , les appels à $http renvoient ce qui suit:

Renvoie un objet promis avec la méthode standard then et deux méthodes spécifiques à http : succès et erreur . La méthode then prend deux arguments: un succès et un erreur de rappel qui sera appelée avec un objet de réponse. Les méthodes success et error prennent un seul argument - une fonction qui être appelé lorsque la demande aboutit ou échoue, respectivement. Les arguments passés dans ces fonctions sont une représentation déstructurée de l'objet de réponse passé dans la méthode then.

Mis à part le fait que l'objet response est déstructuré dans un cas, je ne comprends pas la différence entre

  • les rappels de succès/d'erreur passés pour être transmis en tant qu'arguments de promise.then
  • les callbacks passés en arguments pour les méthodes promise.success/promise.error de la promesse

Y a-t-il? Quel est l'intérêt de ces deux manières différentes de passer des rappels apparemment identiques?

176

NB Cette réponse est factuellement incorrecte; comme indiqué par un commentaire ci-dessous, success () renvoie la promesse initiale. Je ne changerai pas; et laisser à OP pour éditer.


La principale différence entre le 2 est que .then() call renvoie une promesse (résolu avec une valeur renvoyée par un rappel) alors que .success() est un moyen plus traditionnel d’enregistrer des rappels et ne renvoie pas de promesse.

Les rappels basés sur des promesses (.then()) facilitent l'enchaînement des promesses (appelez, interprétez les résultats et puis effectuez un autre appel, interprétez les résultats. , faites encore un autre appel, etc.).

La méthode .success() est une méthode simplifiée et pratique lorsque vous n'avez pas besoin de chaîner un appel ni de travailler avec l'API de promesse (par exemple, dans le routage).

En bref:

  • .then() - toute la puissance de l'API promise, mais légèrement plus détaillée
  • .success() - ne retourne pas de promesse mais offre une syntaxe légèrement plus pratique
155

Il y a déjà de bonnes réponses ici. Mais il est utile de faire comprendre la différence de parallélisme proposée:

  • success() renvoie la promesse d'origine
  • then() renvoie une nouvelle promesse

La différence est then() entraîne des opérations séquentielles, car chaque appel renvoie une nouvelle promesse.

$http.get(/*...*/).
  then(function seqFunc1(response){/*...*/}).
  then(function seqFunc2(response){/*...*/})
  1. $http.get()
  2. seqFunc1()
  3. seqFunc2()

success() pilote les opérations parallèles, car les gestionnaires sont chaînés sur la même promesse.

$http(/*...*/).
  success(function parFunc1(data){/*...*/}).
  success(function parFunc2(data){/*...*/})
  1. $http.get()
  2. parFunc1(), parFunc2() en parallèle
203
event_jr

Quelques exemples de code pour une simple requête GET. Peut-être que cela aide à comprendre la différence. Utiliser then:

$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
});

Utiliser success/error:

$http.get('/someURL').success(function(data, status, header, config) {
    // success handler
}).error(function(data, status, header, config) {
    // error handler
});
114
TheHippo

.then () est chaînable et attendra la résolution de .then () précédent.

.success () et .error () peuvent être chaînés, mais ils vont tous se déclencher en même temps

.success () et .error () ne sont que Nice pour les appels simples (décideurs faciles):

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

de sorte que vous n'avez pas à taper ceci:

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

Mais généralement, je gère toutes les erreurs avec .catch ():

$http.get(...)
    .then(function(response){ 
      // successHandler
      // do some stuff
      return $http.get('/somethingelse') // get more data
    })
    .then(anotherSuccessHandler)
    .catch(errorHandler)

Si vous avez besoin de supporter <= IE8, alors écrivez votre .catch () et .finally () comme ceci (méthodes réservées dans IE):

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

Exemples de travail:

Voici quelque chose que j'ai écrit dans un format plus codé pour rafraîchir ma mémoire sur la façon dont tout cela se passe avec les erreurs de manipulation, etc.:

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

27
nawlbergs

Juste pour compléter, voici un exemple de code indiquant les différences:

succès\erreur:

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

ensuite:

$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
}).
17
MichaelLo

Notice officielle: les succès et les erreurs ont été déconseillés, veuillez utiliser la méthode standard then à la place.

Avis de déprécation: Le succès et l'erreur des méthodes de promesse héritées $ http sont obsolètes. Utilisez la méthode standard then à la place. Si $ httpProvider.useLegacyPromiseExtensions est défini sur false, ces méthodes génèrent une erreur $ http/legacy.

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

capture d'écran: voir la capture d'écran

2
MagicBoy