如何将结果从 $http 传递到 .onsuccess 函数



结果如何从$http对象传递到成功时执行的未命名函数?

$http
    .success(function (result) {
        ...
})

我知道结果是通过我放入函数中的任何变量名称传递的。它通常被称为 result .但是这是怎么做到的呢?这对我来说似乎是魔法。

我希望必须写这样的东西:

$http
    .success(function (result=$http.result) {
        ...
})

你必须研究Javascript函数参数Promises是如何工作的。

我认为,您粘贴的代码来自某个AngularJS应用程序。

如果我的假设是正确的,$http是一种服务,没有任何成功的方法。

成功方法存在于$http方法上:

//get, post, ecc...
$http.get(...).success()

顺便一提:

  1. Javascript 不提供任何匹配参数的方法,它们的顺序始终是被调用方提供的顺序,您使用的名称只适合您(不要与 AngularJS 中的 DependencyInjection 所做的 IOC 混淆(。例 1

function loggerCase1(log1, log2, log3, log4) {
  console.log('loggerCase1 => param-1:', log1);
  console.log('loggerCase1 => param-2:', log2);
  console.log('loggerCase1 => param-3:', log3);
  console.log('loggerCase1 => param-4:', log4);
  console.log('---------------------');
};
function loggerCase2(log4, log2, log1, log3) {
  console.log('loggerCase2 => param-1:', log4);
  console.log('loggerCase2 => param-2:', log2);
  console.log('loggerCase2 => param-3:', log1);
  console.log('loggerCase2 => param-4:', log3);
  console.log('---------------------');
};
function loggerCaseN() {
  for(var i = 0; i < arguments.length; i++) {
    console.log('loggerCaseN => param-' + (i + 1) + ': ', arguments[i]);
  }
  console.log('---------------------');
};
var logs = ['log1', 'log2', 'log3', 'log4'];
loggerCase1.apply(this, logs);
loggerCase2.apply(this, logs);
loggerCaseN.apply(this, logs);

如果很清楚 javascript 中的函数参数行为......你会知道这不可能说给我第一个作为第二个或类似的东西,而且,你粘贴的示例似乎类似于默认参数(在 ES6 中实现,又名 Javascript Harmony(。

让我们进入第 2 点:

  1. 一个简单的承诺链中(在谷歌上找到或查看上面的链接(,你可以使用 return 将结果传递给下一个回调。EXAMPLE2

angular
  .module('promisechainging', [])
  .run(function($q) {
  
    $q
      .when('Hello World')
      .then(function(greetings) {
          console.log('ring 1', greetings);
          return greetings;
      })
      .then(function(salut) {
          console.log('ring 2', salut);
          return salut;
      })
      .then(function(ciao) {
          console.log('ring 3', ciao);
          return { message: ciao };
      })
      .then(function(result) {
          console.log('ring 4', result.message);
          return result;
      })
    
      .catch(function(error) {
          console.log('THIS LOG NEVER HAPPENS BECAUSE THERE AREN'T REJECTED PROMISES');
          return $q.reject(error);
      })
      .finally(function() {
        console.log('We Are At The END');
      })
  ;
  
  })
;
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="promisechainging"></div>

基本上参数如何命名并不重要!

Angular 使用的是 promise 机制,它基本上返回一个对象,让你知道结果何时可用或抛出错误。

当 ajax 调用返回时,angular 正在调用承诺并将结果作为参数提供。

这就像调用常规函数一样。

$http允许您执行异步网络操作并返回一个承诺对象(您可以在此处阅读有关 Angular 中承诺的更多信息(。

successerror 方法用于声明对解析承诺(当请求成功完成时(或被拒绝(当处理请求时出错时(发生的情况的回调。我使用了过去时态,因为它们现在已被弃用,处理这些时态的理想方法是使用 promise 对象的 then 方法。

// Simple GET request example:
$http({
  method: 'GET',
  url: '/someUrl'
}).then(function successCallback(response) {
    // this callback will be called asynchronously
    // when the response is available
  }, function errorCallback(response) {
    // called asynchronously if an error occurs
    // or server returns response with an error status.
  });

基本上,语法几乎相同 - successCallbackFunction 与您在示例的 success 方法中传递的方法具有相同的签名。

但这只是方法签名。您的回调函数参数可以随心所欲地调用(resultdata等(。您需要记住的是,回调函数中的第一个参数将是请求返回的数据。

$http
    .success(function (result) {
        ...
})

$http将返回一个Promise Object,它只不过是一个具有success和不同其他函数的Javascript对象。

因此,当评估$http时,语句立即变为如下所示,

(Promise Object)
    .success(function (result) {
        ...
})

承诺的success函数将保存此匿名函数,以便在解决承诺后调用。我们可以手动解决承诺,但我想 http 会在这里为您做到这一点。

一旦 http request(AJAX( 成功,angular 将告诉这个 Promise 对象通过解析 Promise 来运行这个成功函数,有点像:

suceess: function(responseData){ //success of AJAX
    resolve(responseData); //this will pass the result to promise
}

一旦resolve被称为 promise 对象有结果,它就会调用你最初传递的成功函数,这个结果值。

PS:这是一个粗略的想法,我准备研究一下 Angular 源代码以查看它们的实际实现。

Javascript函数也是类对象。

当$http完成后,它将调用成功或失败函数 - 它们是对象,因此可以传递它们。当它这样做时,它将提供参数。

最新更新