Javascript AngularJS，在服务中使用承诺

我从一个项目的MVP中得到了一个“非常胖的控制器”，我想把它重构成更多的模块化和条块化代码

目前，我的控制器中有一个功能：

对API进行

$HTTP

调用

使用

for

循环和

switch

语句处理返回的数据

将其保存到范围

我想把这个移到服务上。到目前为止，我有：

angular.module('myApp.services', [])
.service('apiService', ['$http', 'webapiBase', function($http, webapiBase) {
  this.getData = function(){
    $http.get(webapiBase + '/api/getData').then(function(res){
      var obj = res.data;
      // Processing stuff
      return obj;
    }, function(err){
      return false;
    })
  }
}]);

在我的控制器中，当此服务返回其数据时，我需要运行回调，如：

// In my Service:
this.getData = function(cb){
    $http.get(webapiBase + '/api/getData').then(function(res){
       var obj = res.data; 
       cb(obj);
    }, function(err){
       cb(false);
    })
  }

// In my controller
apiService.getData(function(data){
    $scope.data = data;
    // Do other stuff here
})   

但这感觉有点奇怪/没有“棱角”

---

在使用

$q

时，是否有更“角度”的方法来实现这一点？

您只需要对您的服务进行一些小的修改

  this.getData = function(){
    return $http.get(webapiBase + '/api/getData').then(function(res){
      // Processing stuff
      return object;
    }, function(err){
      return false;
    })
  }

直接返回

$http.get

的promise对象。然后在你的控制器里

apiService.getData().then(function(data){
    $scope.data = data;
    // Do other stuff here
})

编辑 如果您确实不想重用由

$http

创建的promise对象，您可以快速创建自己的promise对象

this.getData = function() {
    var deferred = $q.defer();

    $http.get(webapiBase + '/api/getData').then(function(res){
      // Processing stuff
      deferred.resolve(object);
    }, function(err){
      deferred.reject('error');
    });

    return deferred.promise;
}

---

你只需要对你的服务做一点小小的修改

  this.getData = function(){
    return $http.get(webapiBase + '/api/getData').then(function(res){
      // Processing stuff
      return object;
    }, function(err){
      return false;
    })
  }

直接返回

$http.get

的promise对象。然后在你的控制器里

apiService.getData().then(function(data){
    $scope.data = data;
    // Do other stuff here
})

编辑 如果您确实不想重用由

$http

创建的promise对象，您可以快速创建自己的promise对象

this.getData = function() {
    var deferred = $q.defer();

    $http.get(webapiBase + '/api/getData').then(function(res){
      // Processing stuff
      deferred.resolve(object);
    }, function(err){
      deferred.reject('error');
    });

    return deferred.promise;
}

---

您可以使用

$q

实现所需的功能

// Your service
angular.module('myApp.services', [])
.service('apiService', ['$http', 'webapiBase', function($http, webapiBase) {
  this.getData = function() {
    var deferred = $q.defer();
    $http.get(webapiBase + '/api/getData').then(
        function (res) {
            // Do something with res.data
            deferred.resolve(res.data);
        },
        function(res){
            deferred.reject();
        }
    );
    return deferred.promise;
  }
}]);

然后使用控制器中的

$q

承诺并响应它：

// Your controller
apiService.getData().then(function(data) {
    $scope.data = data;
    // Do other stuff here
});

---

这是一种有角度的方式，使用带有

$q

的承诺，您可以使用

$q

来实现您想要的目标

// Your service
angular.module('myApp.services', [])
.service('apiService', ['$http', 'webapiBase', function($http, webapiBase) {
  this.getData = function() {
    var deferred = $q.defer();
    $http.get(webapiBase + '/api/getData').then(
        function (res) {
            // Do something with res.data
            deferred.resolve(res.data);
        },
        function(res){
            deferred.reject();
        }
    );
    return deferred.promise;
  }
}]);

然后使用控制器中的

$q

承诺并响应它：

// Your controller
apiService.getData().then(function(data) {
    $scope.data = data;
    // Do other stuff here
});

---

这是一种有角度的方式，使用带有

$q

的承诺时有点困惑-返回$http.get函数作为一个整体，在调用

apiService.getData（）

？@Jascination是的，可以对$http.get（）执行

then

的原因是

get（）

将返回承诺对象。您可以使用

$q

创建自己的，但我个人建议重新使用promise obj。我明白了。因此

返回对象中的
返回
正在返回到由
$http
设置的承诺？是的，当您调用
时（函数x（）{}）
对
$http.get
，函数x将在承诺对象内部注册。一旦请求完成并返回一个对象，promise对象将把结果传递给函数x。有点混乱-返回$http.get函数作为一个整体，在调用
apiService.getData（）
？@Jascination是的，您可以对$http.get（）执行
then
的原因is
get（）
将返回承诺对象。您可以使用
$q
创建自己的，但我个人建议重新使用promise obj。我明白了。因此
返回对象中的
返回
正在返回到由
$http
设置的承诺？是的，当您调用
时（函数x（）{}）
对
$http.get
，函数x将在承诺对象内部注册。一旦请求完成并返回一个对象，promise对象将把结果传递给函数x。