Angular $q 返回已解决的承诺

Angular $q returning resolved promise

我有一个变量 this.eligible,我想将其分配给返回的 promise 的值,而不是实际的 promise 对象。

用户服务

this.eligible = this.sweepstakesService.checkUser(data);

抽奖服务

checkUser({profileId}) {
var deferred = this.$q.defer();
var id = profileId.replace(/[{}]/g, "");

this.$q.when(this.getGuid(id)
  .then(guid => this.determineEligibility(guid))
  .catch(this.handleError))
  .then(function(data){
      deferred.resolve(data);
});

  return deferred.promise;

}

 getGuid(profileId){
    return this.resourcesService.guid.save({id:profileId}).$promise.then(data => data.guid);
  }

 determineEligibility(response){
      return this.resourcesService.eligibility.save({id:response}).$promise.then(data => data.isEligible);
    }


 handleError(response){
      console.log(response);
  }

目前我正在返回 Promise{$$state: Object} 而不是实际解析的值。

为了访问 promise 的结果,您需要提供对 promise 对象的 then 方法的回调,该方法将在结果可用时立即被异步调用。

this.sweepstakesService.checkUser(data)
.then(function(value){
    this.eligible = value;
});

当你使用 promise 时,你正在执行一些异步请求,所以你必须按顺序传递一些 callback 函数检索您的数据,并等待它。

您可以使用来自延迟 API.

$q.defer() 承诺管理器

$q.defer() 得到 2 个方法 :

  • resolve(value) :通过给她最终值

  • 来解决我们相关的承诺
  • reject(reason) :解决了承诺错误。

不要忘记您正在做一些异步工作...

此外,一个很好的提示是将当前上下文保存到一个变量中,以便绑定您的数据。

控制器

(function(){

function Controller($scope, Service) {

  //Save the current context of our controller
  var self = this;

  self.success = '';

  self.fail = '';

  //Declare our promise
  var promise1 = Service.get(2);

  var promise2 = Service.get(6);

  promise1.then(function(response){
    //Retrieve our response and set it to our success variable
    //We use self as our Controller context
    self.success = response;
  }).catch(function(error){
    self.success = error;
  });

  promise2.then(function(response){
    self.fail = response;
  }).catch(function(error){
    //Retrieve our error and set it to our fail variable
    self.fail = error;
  });


}

angular
.module('app', [])
.controller('ctrl', Controller);

})();

服务

(function(){

  function Service($http, $q) {

    function get(n){
      //using $q.defer() from deferred API
      var defer = $q.defer();

      //Simulate latency
      setTimeout(function(){
        n < 3
        ? defer.resolve(n)
        : defer.reject('Error');
      }, 1500);

      //Return our promise
      return defer.promise;

    }

    return {
      get: get
    }

  }

  angular
    .module('app')
    .factory('Service', Service);

})();

然后,您可以使用 controllerAs 语法实例化您的控制器。

HTML

  <body ng-app='app' ng-controller='ctrl as self'>

    <div>Success : {{self.success}}</div>
    <div>Fail : {{self.fail}}</div>

  </body>

你可以看到一个关于这个的例子Working Plunker