Должен ли я создавать pipe() в своем сервисе, если я сделал это в своем component.ts

#angular

#angular

Вопрос:

Я немного смущен, поскольку я видел, что некоторые люди пишут pipe() service как в component , так и в том, где они вызывают own service
У меня есть сервис
my-service.ts

 getList(): Observable<any> {
    return this.http.get(`${environment.api}/list`);
  }
 

И у меня есть компонент, который использует этот сервис
component.ts

 this.myService.getList().pipe(
      catchError(() => of(null)),
      finalize(() => this.loading = false)
    ).subscribe((res: any) => {if(res) this.list = res }
 

Как вы можете видеть, я сделал pipe(catchError(),finalize()) в своем component.ts . Должен ли я сделать то же самое в своем service.ts?
Что-то вроде этого
my-service.ts

 getList(): Observable<any> {
        return this.http.get(`${environment.api}/list`).pipe(...other same code);
      }
 

Это похоже на двойную работу

Ответ №1:

.pipe() это метод rxjs , который позволяет вам связывать операторы из rxjs/operators like map(), filter(), ... . В документации сказано, что цель метода pipe состоит в том, чтобы сделать цепочку этого метода более удобочитаемой для человека секцией трубопровода

Вопрос, который вы должны задать себе, заключается в том, считаете ли вы, что логика будет использоваться совместно в вашем приложении, или она специфична для вашего компонента?

  • В первом случае я бы использовал .pipe() в своем сервисе
  • В противном случае вы можете использовать его в своем компоненте. Одним из преимуществ использования .pipe() с операторами rxjs в вашем компоненте является то, что вы можете легко отказаться от подписки на наблюдаемые, используя такие операторы, как .pipe(takeUntil(timer(1000)) , избегая таким образом утечек памяти.

Ответ №2:

Это действительно зависит от вашего варианта использования. Если вы хотите повлиять только на данные в компоненте, передавайте их только туда. Если вы хотите повлиять на данные, используемые везде, сделайте это в сервисе. Если вы хотите делать одно везде и другое в своем компоненте, делайте это по-разному в каждом месте. Просто к вашему сведению — pipe просто означает, что вы что-то делаете с данными после их получения