Какими способами можно отписываться от RxJS-подписок без использования ngOnDestroy?

В Angular подписки на Observable без отписки приводят к утечкам памяти, поэтому важно управлять их жизненным циклом. Классический подход через ngOnDestroy и массив подписок работает, но есть более элегантные способы, не требующие явного хука.

Основные способы

• async pipe — самый предпочтительный способ в шаблонах: Angular сам подписывается и отписывается при уничтожении компонента.
• takeUntil с Subject, который эмитит в ngOnDestroy (или через DestroyRef).
• take(1) или first() — для одноразовых запросов, подписка завершается автоматически.
• takeWhile с флагом активности компонента.
• DestroyRef (Angular 16+) — inject(DestroyRef).onDestroy() для регистрации отписки без ngOnDestroy.

Пример с takeUntil и DestroyRef

import { Component, inject, DestroyRef } from '@angular/core';
import { Subject, takeUntil } from 'rxjs';

@Component({ selector: 'app-demo', template: '' })
export class DemoComponent {
  private destroyRef = inject(DestroyRef);
  private destroy$ = new Subject<void>();

  constructor(private service: DataService) {
    this.destroyRef.onDestroy(() => this.destroy$.next());
    this.service.data$.pipe(takeUntil(this.destroy$)).subscribe(d => console.log(d));
  }
}

Пример с async pipe

@Component({
  selector: 'app-list',
  template: `<div *ngFor="let item of items$ | async">{{ item }}</div>`
})
export class ListComponent {
  items$ = this.service.getItems();
  constructor(private service: DataService) {}
}

Async pipe не только управляет подпиской, но и автоматически вызывает markForCheck при новых значениях, что упрощает работу с OnPush-стратегией.

Когда что применять

• Для данных, отображаемых в шаблоне — async pipe.
• Для императивной логики в компоненте — takeUntil с DestroyRef или Subject.
• Для одноразовых HTTP-запросов — take(1) или first().

Итог: используйте async pipe как основной инструмент, а takeUntil с DestroyRef — для сложных сценариев, чтобы избежать ручного управления подписками и утечек памяти.