Angular: отписаться от switchMap

Question

У меня есть следующий компонент:

@Component({...})
export class AppComponent implements OnInit, OnDestroy {

  destroy$ = new Subject();
  update$ = new Subject();

  result: Result;

  constructor(service: Service) {
  }

  ngOnInit() {
    update$.pipe(
      takeUntil(this.destroy$),
      switchMap(() => this.service.get())
    ).subscribe(result => this.result = result);

    this.refresh();
  }

  ngOnDestroy() {
    this.destroy$.next();
    this.destroy$.complete();
  }

  refresh() {
    this.update$.next();
  }

}

Правильный ли этот подход? Или я должен позвонить takeUntil(this.destroy$) после switchMap?

update$.pipe(
  switchMap(() => this.service.get()),
  takeUntil(this.destroy$)
).subscribe(result => this.result = result);

Или я должен позвонить дважды?

update$.pipe(
  takeUntil(this.destroy$),
  switchMap(() => this.service.get()),
  takeUntil(this.destroy$)
).subscribe(result => this.result = result);

Answer 1

Самый чистый способ - позвонить takeUntil после switchMap.

update$.pipe(
  switchMap(() => this.service.get()),
  takeUntil(this.destroy$)
).subscribe(result => this.result = result);

Это предотвратит любые выбросы в подписку. Если вы добавите takeUntil ранее, подписка switchMap будет выдавать значения до тех пор, пока не завершится наблюдаемое, возвращаемое функцией project, что может быть никогда (в зависимости от кода вашей услуги).

Это необязательновызывать takeUntil как до, так и после switchMap, потому что switchMap отписывается от наблюдаемого источника (все до switchMap), когда сам от него отписывается.

Answer 2

Обычно вы хотите, чтобы takeUntil был последним оператором. В вашем случае это правильный подход:

update$.pipe(
  switchMap(() => this.service.get()),
  takeUntil(this.destroy$)
).subscribe(result => this.result = result);