Вызов subscribe из сервиса в Angular2

223

05 мая 2018, 16:07

Я в сервисе делаю общую функцию (для всех компонентов) для запроса к серверу. Для обработки ошибок на сервере и в самом ответе сразу вызываю subscribe. Как можно дальше в компоненте получить response? Повторно вызывать subscribe (getData().subscribe..) не получается. Сохранять response в локальные переменные и отдельно вызывать?

  getData(){
   return this.http.get(url)
      .subscribe(response => {
        return response;
      }, error => {
        return error;
      });

Answer 1

Вот пример запроса в сервисе:

getUsersList() {
    const url = 'http://test.ru/api/users/'; // url запроса
    return this.http.get(url)
    .map(
      ( res ) => {
        return res; // можно что то сделать с ответом перед подпиской из компонента
    });
  }

Делаем переменную dataResponse в сервисе:

 import { Subject } from 'rxjs/Subject'; 
 ... // переходим в класс
 public dataResponse = new Subject<any>();

Затем вызов из того же сервиса:

getResult() { 
 this.getUsersList().subscribe(
    (data) => {
        console.log(data); // список пользователей
        this.dataResponse.next(data);
    }, (error) => {
        console.log(error); // сервер вернул ошибку
        // сделать что угодно.
       }
 );
}

Что бы избежать двойного получения данных из сервиса и компонента просто нужно в компоненте подписаться на dataResponse нашего сервиса.

this.ourService.dataResponse.subscribe(
  (data) => {
      // data -  Полученные данные.
  }
)

Answer 2

Можно использовать сколько хотите map, filter - они будут вызваны до subscribe. Они будут вызываны, если сервер вернул статус 200-OK. В них вы можете сделать проверку на валидность JSON, проверить ответ еще как-то согласно вашей логике.

В catch попадут ошибки, связанные с недоступностью ресурса (404, 500, 503) или если было какое-то исключение в map.

getData(){
   return this.http.get(url)
      .map(response => { // Здесь делаете преобразования
        return response;
      })
      .map(response => { // Здесь делаете проверки
        if(response==null) 
           throw new Error("response is null");
        return response;
      })
      .catch(error=> {
        return response;
      });

Потом где-то в компонентах.