AngularJS: выполнение запроса $http внутри пользовательской службы и возврат данных

Я определил пользовательскую службу http в angular, которая выглядит следующим образом:

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;
});

И я могу получить доступ к этой службе в моем контроллере следующим образом:

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

  var webService = 'getUser?u=3'

  myhttpserv.async(webService).then(function (data) {
      console.log(data);
  })

});

Однако теперь мне нужно упростить этот процесс, чтобы он ВСЕ содержался внутри службы со статическим URL-адресом и просто возвращал данные. Так что я могу просто вызвать его в контроллере так:

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

      console.log(myhttpserv.var1);
      console.log(myhttpserv.var2);
      etc...

});

Я не могу настроить сервис, чтобы получить эту функциональность. Кто-нибудь знает правильный способ сделать это?


javascript angularjs angular-http angularjs-service
person AzzyDude    schedule 09.06.2014    source источник

Ответы (1)


arrow_upward
16
arrow_downward

Вариант 1. Используйте API обещаний

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

Контроллер:

angular.module('myApp').controller('myCtrl', function ($scope, myhttpserv) {
     myhttpserv.then(function(response){
         console.log(response.data);
     });     
});

Вариант 2. Использование разрешения маршрута

angular.module('myApp', ['ngRoute']).config(['$routeProvider',
  function($routeProvider) {
    $routeProvider.
      when('/myCtrl', {
        templateUrl: 'myView.html',
        controller: 'myCtrl',
        resolve: {
        load: function (myhttpserv) {
            return myhttpserv;
        }
      });
  }]);

Сервис:

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;
    });

Контроллер:

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

      console.log(myhttpserv.data.var1);
      console.log(myhttpserv.data.var1);
      etc...

});

Вариант 3. Используйте службу $interval

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;
});

Контроллер:

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);    
});
person Robin Rizvi    schedule 09.06.2014
comment
Итак, я не могу просто заставить службу возвращать объект после завершения http-вызова и обращаться к этому объекту с моего контроллера в одной строке? - person AzzyDude; 09.06.2014
comment
Вы должны использовать promise.then или использовать интервал для этого, так как мы не знаем, когда вернется вызов ajax. Если вы используете угловой маршрутизатор, вы также можете настроить маршрутизацию, и ваш контроллер будет загружаться только тогда, когда будут разрешены указанные промисы (запросы ajax). - person Robin Rizvi; 09.06.2014
comment
Можно ли интегрировать «promise.then» в ваш ответ, чтобы контроллер загружался только при разрешении запроса? - person AzzyDude; 09.06.2014
comment
Пожалуйста, оцените / отметьте как ответ, если он отвечает на ваш вопрос - person Robin Rizvi; 09.06.2014
comment
Спасибо за помощь! Очень лаконично! - person AzzyDude; 10.06.2014