Question

19

AngularJS: Performing $http request inside custom service and returning data

rated 0 times [ 22] [ 3] / answers: 1 / hits: 20032 / 10 Years ago, mon, june 9, 2014, 12:00:00

I have defined a custom http service in angular that looks like this:

angular.module('myApp')

  .factory('myhttpserv', function ($http) {



  var url = http://my.ip.address/



  var http = {

      async: function (webService) {

          var promise = $http.get(url + webService, { cache: true }).then(function (response) {

            return response.data;

        });

          return promise;

       }

  };

  return http;

});

And I can access this service in my controller like so:

angular.module('myApp')

  .controller('myCtrl', function (myhttpserv) {



  var webService = 'getUser?u=3'



  myhttpserv.async(webService).then(function (data) {

      console.log(data);

  })



});

However I now need to streamline this process so that it is ALL contained inside the service with a static url and it simply returns the data. So that I can just call it in the controller like so:

 angular.module('myApp')

  .controller('myCtrl', function ($scope, myhttpserv) {



      console.log(myhttpserv.var1);

      console.log(myhttpserv.var2);

      etc...



});

I can't seem to tweak the service to get this functionality. Anyone know the correct way to do it?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

rocioblancac

Add To Favorites

Follow

Total Points: 699

Total Questions: 96

Total Answers: 108

Location: Libya

Member since Mon, Dec 7, 2020

4 Years ago

rocioblancac questions

1 Angular: Error trying to diff '[object Object]'. Only arrays and iterables are allowed

Mon, Dec 13, 21, 00:00, 3 Years ago

1 Bootstrap multiple file selection - show only first file

Sun, Jul 26, 20, 00:00, 4 Years ago

1 React JS How to disable zoom

Wed, Jul 22, 20, 00:00, 4 Years ago

1 React Native https axios resquest gets Network Error on Android but not iOS

Thu, Jan 16, 20, 00:00, 4 Years ago

1 Color Input in React: The format is #rrggbb where rr, gg, bb are two-digit hexadecimal numbers

Mon, Jan 6, 20, 00:00, 5 Years ago

View All

answered 10 Years ago ronaldodarioc · Accepted Answer

Option 1 - Use promise API

angular.module('myApp').factory('myhttpserv', function ($http) {

  return $http.get('http://my.ip.address/getUser?u=3', { cache: true });

});

Controller:

angular.module('myApp').controller('myCtrl', function ($scope, myhttpserv) {

     myhttpserv.then(function(response){

         console.log(response.data);

     });     

});

Option 2 - Using route resolve

angular.module('myApp', ['ngRoute']).config(['$routeProvider',

  function($routeProvider) {

    $routeProvider.

      when('/myCtrl', {

        templateUrl: 'myView.html',

        controller: 'myCtrl',

        resolve: {

        load: function (myhttpserv) {

            return myhttpserv;

        }

      });

  }]);

Service:

angular.module('myApp').factory('myhttpserv', function ($http) {

      var data = {};

      var url = http://my.ip.address/;

      var promise = $http.get(url + 'getUser?u=3', { cache: true }).then(function (response) {

                data = response.data;

            });

      return data;

    });

Controller:

 angular.module('myApp')

  .controller('myCtrl', function ($scope, myhttpserv) {



      console.log(myhttpserv.data.var1);

      console.log(myhttpserv.data.var1);

      etc...



});

Option 3 - Use $interval service

angular.module('myApp').factory('myhttpserv', function ($http) {

  var data = {};

  var url = http://my.ip.address/;

  var promise = $http.get(url + 'getUser?u=3', { cache: true }).then(function (response) {

            data = response.data;

        });

  return data;

});

Controller:

angular.module('myApp').controller('myCtrl', function ($scope, $interval, myhttpserv) {

      $scope.intervalPromise = $interval(function(){

          if (Object.keys(myhttpserv.data).length!=0)

          {

              console.log(myhttpserv.data);

              $interval.cancel($scope.intervalPromise);

          }

      }, 100);    

});