Javascript 在angularjs中调用http（RESTfulWebAPI）的正确方法

我有以下控制器代码

module.registerController('DemoCtrl', function ($scope, myFactory) {
        myFactory.get(function (data) {
            console.log(data); /// data is always undefined 
        });
    });

module.registerController('DemoCtrl', function ($scope, myFactory) {
    myFactory.get("url").then(function(d) {
            console.log(d.data); 
        }
    });
});

并遵循调用RESTfulWebAPI的工厂

module.registerFactory('myFactory', ['$http',
    function ($http) {
            function get(callback) {
                $http.get('mywebapiurl')
                    .success(function (response) {
                        //debugger; data comes back from server
                        callback(response);
                    }).error(function (response, status, headers, config) {
                        callback(response);
                    });
            }

        return {
            get: get
        }
    }]);

module.registerFactory('myFactory', ['$http',
function ($http) {
         var apiFactory = {
               get:function(url){
                   return $http.get(url);
               }
         }
    return apiFactory;
}]);

工厂正在调用webapi服务，并将数据取回。但是，在控制器中，数据不会返回

我是不是漏掉了什么明显的东西？还不确定这是否是使用factory在controller中调用angularjs中的webservice的最佳方法。欢迎任何意见

谢谢，

控制器代码

module.registerController('DemoCtrl', function ($scope, myFactory) {
        myFactory.get(function (data) {
            console.log(data); /// data is always undefined 
        });
    });

module.registerController('DemoCtrl', function ($scope, myFactory) {
    myFactory.get("url").then(function(d) {
            console.log(d.data); 
        }
    });
});

正在调用restful webapi的工厂

module.registerFactory('myFactory', ['$http',
    function ($http) {
            function get(callback) {
                $http.get('mywebapiurl')
                    .success(function (response) {
                        //debugger; data comes back from server
                        callback(response);
                    }).error(function (response, status, headers, config) {
                        callback(response);
                    });
            }

        return {
            get: get
        }
    }]);

module.registerFactory('myFactory', ['$http',
function ($http) {
         var apiFactory = {
               get:function(url){
                   return $http.get(url);
               }
         }
    return apiFactory;
}]);

工厂的成败

module.registerFactory('myFactory', ['$http',
function ($http) {
     var apiFactory = {
           get:function(url){
               return $http.get(url).then(function(response){
                      // success
                      return responce.data;
               },function(error){
                      //failure
                      return error;
               };
           }
     }
    return apiFactory;
}]);

您希望返回一个而不是传递回调。由于

$http.get

已经返回了一个承诺，您可以直接返回该承诺，或者直接返回响应数据的派生承诺。顺便说一下，您的

工厂

看起来应该是

服务

：

angular.moudule('yourApp')
.service('myService', ['$http', myService]);

function myService($http) {
    this.get = function(url) {
        return $http.get(url)
                   .then(function transformData(response){
                       return response.data;
                   }).catch(function onError(rejectionResponse){
                       //Whatever you want to do here
                   });
    }
}

通过这种方式，

myService.get

将返回一个承诺，您可以

.then（）

、

.catch（）

和

.finally（）

继续使用框架编码风格。例如：

var squirrels = [];
myService.get('http://squirrelshop.com/api/squirrels')
    .then(function(squirrelsData){
        console.log('Got the squirrels!');

        squirrels = squirrelsData;
    }).catch(function(rejection){
        console.warn('Couldnt fetch squirrels. Reason: ' + rejection);
    });

---

请尝试myFactory.get（）。然后（函数（数据）{}）是否可以将成功和失败代码保留在factory中？是的，这是可能的，让我在回答中添加这一点。谢谢承诺似乎是一种更好的方法。你可以发布一个使用承诺的示例代码吗。我对使用回调也有点不安。thanks@activebiz是的。我建议对承诺和它们的语法做一些研究，它们非常优雅，但解释这些承诺到底是如何起作用的对于一个如此宽泛的答案来说有点过于宽泛；-）