Angular httpClient создает наблюдателя?

Question

Говорят, что

httpsClient в угловом выражении создает наблюдаемое, я пытаюсь понять понятие наблюдаемого, поэтому, если оно создает наблюдаемое, зачем его объявлять?Это смущает меня, потому что у меня есть этот проект, над которым я работаю, и человек, который написал код, использовал службу для получения или публикации некоторых данных из базы данных (используя http.get), и он подписывается на это

this.http.post('apihere','formhere',{
headers: new Httpheaders().set("content-type","application/json")
}).subscribe(data =>{//some stuff here})

Вещи, которые я не понимаю: почему он не объявил наблюдателя, могу ли я просто воспользоваться услугой и подписаться, не назначив наблюдателя?

Answer 1

Да, вы можете.

Согласно документам:

HttpClient доступен в виде инъекционного класса с методами для выполнения HTTP-запросов.Каждый метод запроса имеет несколько подписей, и тип возвращаемого значения зависит от того, какая подпись вызывается (в основном это значения наблюдаемого и responseType).

, но если вы посмотрите на метод Post, он вернет наблюдаемыйObject, HttpStream, ArrayBuffer и т. д.

Вы можете просто определить свой метод обслуживания и подписаться на него в своем классе component.Пример:

У класса обслуживания есть

submitRequest(requestObj: any) {
    return this.httpClient.post(`my-url`, requestObj)
        .map(//do something);
}

В вашем классе компонентов просто подпишитесь на ваш сервис:

myService.submitRequest(requestObj).subscribe( (response) => { 
  //do something with response 
});

Answer 2

Сначала давайте попробуем понять разницу между Observable и Observer:

Кажется, что вы используете термины Observer и Observable взаимозаменяемо, что я не считаю правильнымчто нужно сделать.

Из этой статьи от Девиза Тодда :

Наблюдаемый : это простофункция, с несколькими особыми характеристиками.Это то, что он принимает «наблюдателя» (объект с методами «next», «error» и «complete») и возвращает логику отмены.В RxJS это был бы объект Subscription с методом отписки.

Наблюдатель - это литерал объекта, который мы передаем в наш .subscribe() (подписка вызовет нашу Observable).

---

Теперь давайте посмотрим, что говорит Angular StyleGuide:

Теперь, когда эта путаница устранена, давайте поговорим о том, что Руководство по стилю Angular скажем.

В нем подчеркивается Принцип единой ответственности :

Применить одиночныйпринцип ответственности (SRP) для всех компонентов, услуг и других символов.Это помогает сделать приложение чище, легче читать и поддерживать, а также более тестируемым.

Суть принципа единой ответственности заключается в том, что каждый кусок кода, который мы пишем, должен отвечать за один и JUST ONE задача.

Для компонента: это будет означать, что ответственность состоит в том, чтобы принимать пользовательские входные данные и показывать пользователю некоторые выходные данные.Теперь, что именно он показывает как вывод, и что именно он делает с вводом, на самом деле не является его ответственностью.

Для Службы: это будет означать, что ответственность заключается только вполучить входные данные от компонента и сделать что-то с ним.Кроме того, он отвечает за обращение к внешним источникам и получение данных, которые компонент должен отображать в представлении.

---

Возвращаясь к вашему примеру:

В идеале все, что получено от каких-либо методов в HttpClient, обычно возвращается как есть или после map ping к Компоненту.Таким образом, использование subscribe внутри метода Service не имеет особого смысла и должно рассматриваться как анти-шаблон.

Таким образом, ваш Service может быть реорганизован следующим образом:

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';

@Injectable()
export class DataService {

  constructor(private http: HttpClient) {}
  ...

  postData(formData) {
    return this.http.post('API', formData);
  } 

}

И этот сервис может быть использован в вашем Компоненте следующим образом:

import { Component } from '@angular/core';

import { DataService } from './data.service';

@Component({...})
export class YourComponent {

  constructor(private dataService: DataService) {}
  ...

  postData(formData) {
    this.dataService.postData(formData)
      .subscribe(response => /* DO SOMETHING WITH THE RESPONSE */);
  } 

}

---

PS: Я не говорю, что неправильно subscribe - Observable.Все, что я предлагаю, если данные являются чем-то, что будет использоваться как есть в компоненте, то Observable следует просто вернуть из метода Service и указать subscribe d в компоненте.

Answer 3

Да, вы можете просто подписаться.

Из документации здесь: http://reactivex.io/documentation/operators/subscribe.html

Оператор подписки является связующим звеном, соединяющим наблюдателя с наблюдаемой.Чтобы наблюдатель мог видеть объекты, испускаемые Наблюдаемой, или получать сообщения об ошибках или заполненные уведомления от Наблюдаемой, он должен сначала подписаться на это Наблюдаемое с помощью этого оператора.

Типичная реализация оператора Subscribeможет принимать от одного до трех методов (которые затем составляют наблюдателя) , или может принимать объект (иногда называемый наблюдателем или подписчиком), который реализует интерфейс, который включает в себя эти три метода:

В этом примере:

this.productService.getProduct(id)
  .subscribe(
    (product: Product) => this.displayProduct(product),
    (error: any) => this.errorMessage = <any>error
  );

Два метода, переданные в подписку, составляют наблюдателя.