javascript - 未设置对象属性，但控制台另有说明

Question

我正在尝试使用 Angular 设置 strip 验证服务。我基本上想调用 StripeResponse.get() 并让它返回错误或 Stripe 响应的 token 。

我的问题是，当我执行此代码时，如果我执行 var a = StripeResponse.get(); 然后将 a 记录到控制台，我会看到 空。

如果我在 return this.response; 之前添加 console.log(this);，我会看到以下内容:

Object {response:null, get: function}
 > get: function() {
 v response: Object
    code: "invalid_number"
    message: "This card number looks invalid"
    param: "number"
    type: "card_error"

我不明白该控制台日志中的“response:null”和“response:Object”之间的差异。下面是我的服务/模块代码。

var app = angular.module('StripeVerify', [ ]);

app.service('StripeResponse', function () {
  return {
    response: null,
    get: function () {
      var form = $('form[name="ccForm"]');
      Stripe.createToken(form, $.proxy(function (status, response) {
        if (response.error) {
          return this.response = response.error;
        } else {
          return this.response = response.id;
        }
      }, this));
      return this.response;
    }
  }
});

Answer 1

由于 createToken 方法不返回 promise 或没有任何类型的回调机制，因此您应该只使用 Angular $q's Defered API并为您的服务创建 promise 模式。

app.service('StripeResponse', ['$q', function ($q) {
  return {
    response: null,
    get: function () {
      var defered = $q.defer(); //Create a deffered object

      var form = $('form[name="ccForm"]');
      Stripe.createToken(form, function (status, response) {
        if (response.error) {
           defered.reject(response.error); //reject the promise

        } else {
            defered.resolve(response.id); //resolve the promise
        }

      });
      return defered.promise;
    }
  }
}]);

在使用您要做的服务时(伪代码):

  StripeResponseService.get()
  .then(function(id){//Handle Success
  })
  .catch(function(error){//Handle failure
  })