BACK
Use casestoObservable — Signal в Observable pipeline
Use cases · 37

toObservable — Signal в Observable pipeline

Паттерн

Обратное направление: signal хранит выбранный id, но загрузку по id хочется описать через switchMap + retry + catchError. toObservable(mySignal) — мост в сторону RxJS pipeline.

Какую проблему решаем

Если оставаться полностью на signals, придётся писать effect с ручной отменой Promise. Это быстро становится сложным: легко применить ответ для уже устаревшего id, или забыть отменить fetch при изменении signal.

Операторы и зачем они нужны

  • BehaviorSubject в примере симулирует signal — хранит текущее значение и эмитит при изменении.
  • distinctUntilChanged — не запускаем загрузку для того же id.
  • switchMap — новый id отменяет запрос для старого. Гонка ответов решена декларативно.
  • map — форматируем ответ для UI.

Подводные камни

  • mergeMap вместо switchMap — старый медленный ответ перетрёт новый.
  • Не вызывайте toObservable внутри computed или template — на каждый пересчёт будете создавать новый stream и новые подписки.
  • Слишком частые изменения signal — добавьте debounceTime, чтобы не дёргать сеть на каждый чих.

Что в итоге получаем

Signal управляет RxJS-загрузкой. Лучшие части обоих миров: синхронный state и декларативная отмена устаревших запросов.

script.ts // TypeScript
CONSOLE · Console Output
Нажмите на запуск, чтобы увидеть результат...