как использовать $ http в сервисе или на фабрике с ионной структурой

Question

как использовать $ http в сервисе или на фабрике с ионной структурой

0

Я пытаюсь использовать базовый шаблон вкладок в ионной форме. Просто хотел использовать $ http внутри службы и собирать данные из конечной точки API. Он работает, когда в контроллере используется $ http, но он не находится внутри службы. Это основной шаблон вкладок в ионной структуре. Я пытаюсь создать что-то поверх этого, просто изменив источник данных на конечную точку api.

   //Service body starts

      .service('Datas', function($http) {
     $http.get('https://www.googleapis.com/api_url').then(function(response){
           var datas = response.data.items; 

  return {
    all: function() {
      return datas;
    },

    get: function(dataId) {
      for (var i = 0; i < data.length; i++) {
        if (datas[i].id === parseInt(dataId)) {
          return data[i];
        }
      }
      return null;
    }
  };
           });
  //Service body ends


   //controller starts here
.controller('Cntrl', function($scope, Datas) {

  $scope.data = Datas.all();

})
  //controller ends here


  //template starts
   <div ng-repeat="data in datas">
   {{data.title}}       

    </div>

  //template ends

Mithun Nath 05 сен. 2016, в 00:32

Источник

Теги:

ionic-framework

angularjs

http

api

service

2 ответа

0

У вас есть синтаксические ошибки, возвращаемый объект должен находиться в области обслуживания.

.service('Datas', function($http) {
    var datas = null;
    $http.get('https://www.googleapis.com/api_url')
        .then(function(response) {
            datas = response.data.items;
        });
    return {
        all: function() {
            return datas;
        },

        get: function(dataId) {
            for (var i = 0; i < data.length; i++) {
                if (datas[i].id === parseInt(dataId)) {
                    return data[i];
                }
            }
            return null;
        }
    };
});

damjtoh 04 сен. 2016, в 21:34

0

Привет, попробовал, как вы предложили, но не сработало. Ничего не показывает. Пример кода от ionic содержит такие фиктивные данные. ** var datas = [{id: 0, имя: 'Peter', lastText: 'Klassen', face: 'img / ben.png'}, {id: 1, name: 'Eric', lastText: 'Robert' , face: 'img / max.png'}, {id: 2, name: 'John', lastText: 'Manuel', face: 'img / adam.jpg'}, {id: 3, name: 'Sam' , lastText: 'McMannis', face: 'img / perry.png'}]; ** Я пытаюсь вызвать данные API вместо этих фиктивных данных.
Mithun Nath 05 сен. 2016, в 02:47
0

это начало работать сейчас. Спасибо
Mithun Nath 05 сен. 2016, в 03:06

Ещё вопросы

Привет, попробовал, как вы предложили, но не сработало. Ничего не показывает. Пример кода от ionic содержит такие фиктивные данные. ** var datas = [{id: 0, имя: 'Peter', lastText: 'Klassen', face: 'img / ben.png'}, {id: 1, name: 'Eric', lastText: 'Robert' , face: 'img / max.png'}, {id: 2, name: 'John', lastText: 'Manuel', face: 'img / adam.jpg'}, {id: 3, name: 'Sam' , lastText: 'McMannis', face: 'img / perry.png'}]; ** Я пытаюсь вызвать данные API вместо этих фиктивных данных.
это начало работать сейчас. Спасибо

georgeawg · Accepted Answer · 2016-09-04T21-10-00.000Z

Объявление переменной datas должно быть в структуре сервиса. Не заключен в функцию обработчика успеха.

app.service('Datas', function($http) {
    //Declare datas here
    var datas = [];

    $http.get(url).then(function(response){
        //NOT here
        //var datas = response.data.items;
        //Also use angular.copy
        angular.copy(response.data.items, datas);
    }); 

    return {
        all: function() {
            return datas;
        },
        get: function(dataId) {
            for (var i = 0; i < datas.length; i++) {
                if (datas[i].id === parseInt(dataId)) {
                    return datas[i];
                };
            };
            return null;
        }
    };
});

Кроме того, поскольку контроллер извлекает datas объекта ссылки до завершения XHR, использовать angular.copy. Избегайте использования оператора присваивания, который заменил бы исходную ссылку на объект новой ссылкой на объект.

Прикрепление свойства `$promise`

Это может быть мудрым, чтобы прикрепить httpPromise как свойство к datas объекта.

app.service('Datas', function($http) {
    //Declare datas here
    var datas = [];

    datas.$promise = $http.get(url).then(function(response){
        //NOT here
        //var datas = response.data.items;
        //Also use angular.copy
        angular.copy(response.data.items, datas);
        //return data for chaining
        return datas;
    });

Свойство $promise может пригодиться при попытке избежать условий гонки, таких как контроллер, использующий Datas.get до завершения Datas.get.

Привет, попробовал оба пути, но не сработало. Ничего не показывает. Пример кода от ionic содержит такие фиктивные данные. ** var datas = [{id: 0, имя: 'Peter', lastText: 'Klassen', face: 'img / ben.png'}, {id: 1, name: 'Eric', lastText: 'Robert' , face: 'img / max.png'}, {id: 2, name: 'John', lastText: 'Manuel', face: 'img / adam.jpg'}, {id: 3, name: 'Sam' , lastText: 'McMannis', face: 'img / perry.png'}]; ** Я пытаюсь вызвать данные API вместо этих фиктивных данных.

как использовать $ http в сервисе или на фабрике с ионной структурой

2 ответа

Прикрепление свойства $promise

Ещё вопросы

Прикрепление свойства `$promise`