繁体   English   中英

如何从带有角度工厂的REST API返回http获取请求?

[英]How to return a http get request from rest api with angular factory?

我正在尝试从工厂内的其他api URL返回http get请求。 但这不是返回数据而是函数。 当我在控制器内使用控制台日志时,它将显示整个功能。

MyApp.factory('userFactory', function($http) {

    var factory = [];

    factory.users = function(){
        $http({
            url: '/test/users',
            method: 'GET'
        })
        .then(function successCallback(response) {
            factory.users = response;

        }, function errorCallback(response) {
            factory.users = response;
        });

        return factory.users;
    };

    return factory;

});

我在项目中也做同样的事情。 在此处查看回购: https : //github.com/ahmadabdul3/mean-flapperNews/tree/master/public/Index/angular

httpService是我的http处理程序。 然后,您可以查看postsService,请参阅我的getAllPosts函数

基本上就像注释中所说的那样,您必须返回一个诺言并在控制器中处理它

所以你这样做:

function getAllPosts() {
        httpService.baseGet(httpUrls.posts)
        .then(function(data) {
            angular.copy(data, posts);
            posts.push({title: 'post test', link: '', upvotes: 3, comments: []});
        }, function(data) {
            httpService.handleError(data);
        });
    }

并让http服务完成这项工作:

angular.module('httpService', [])
.factory('httpService', httpService);

httpService.$inject = ['$http', '$q'];

function httpService($http, $q) {
    var serv = this;
    var methods = {
        httpGet : 'GET',
        httpPost : 'POST',
        httpPut : 'PUT',
        httpDelete : 'DELETE'
    };
    function baseGet(url) {
        return $http.get(url).then(
                function (result) {
                    return result.data;
                },
                function (result) {
                    return $q.reject(result);
                }
                );
    }
    function httpWithParams(url, method, data) {

        return $http({
                url: url,
                method: method,
                params: data,
                dataType: "json",
                headers: {
                    "Content-Type": "application/json"
                }
            }).then(
                function (result) {
                    console.log(result.data);
                    return result.data;
                },
                function (result) {
                    return $q.reject(result);
                }
            );
    }
    function handleError(error) {
            console.log(error);
    }

    return {
        baseGet: baseGet,
        httpWithParams: httpWithParams,
        handleError: handleError,
        methods: methods
    }
}

请参阅$ http docs-它返回一个诺言,因此您需要相应地进行处理。 您的变量命名中似乎也有一些冲突,这对解决问题没有帮助。

我建议遵循johnpapa的角度样式指南 -在这种情况下,数据服务规则应如此。 您已经拥有了大部分。

您可以像下面那样在控制器中处理promise-或使用设置器(工厂中的getUser / setUsers在控制器/问题之间共享)。

  MyApp.factory('userFactory', function($http) {
    // Expose public API first, use func notation
      return { 
          getUsers: getUsers,
      };

      function getUsers(){
          return $http.get('/test/users');
      }
 });

 MyApp.controller('UserController', function(userFactory) {
    // bindables up top
    vm.users = [];

    activate();

    //separate activation logic / promise resolution
    function activate(){
        userFactory.getUsers().then(function(users){
          vm.users = users.data;
        });
    }    
});

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM