Dirty leave confirm — подтверждение ухода со страницы

Паттерн

У пользователя несохранённые изменения, и он пытается уйти со страницы. Показываем диалог «У вас есть несохранённые изменения. Уйти?». Если изменений нет — пускаем без вопросов.

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

Состояние dirty меняется со временем — пользователь может тронуть и откатить форму. Если читать dirty заранее или в начале сессии, guard будет использовать устаревшее значение. Плюс — если пользователь несколько раз нажимает «назад», нужно отменить старый диалог и применять только результат последнего.

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

• withLatestFrom(dirty$) — берёт dirty state именно в момент попытки навигации. Свежее значение, не устаревшее.
• filter — пропускаем дальше только если dirty=true. Чистая форма уходит без диалога.
• switchMap — при новой попытке навигации отменяет старый диалог. Применяется только последний ответ.
• map — boolean из диалога превращаем в action: leave или stay.

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

• mergeMap — два диалога могут открыться одновременно, и применится результат ВТОРОГО для ПЕРВОЙ попытки. Хаос.
• exhaustMap — проигнорирует новую попытку, пока пользователь не закрыл предыдущий диалог. Плохо при смене целевого URL.
• Не подписывайтесь на dirty$ заранее и не сохраняйте значение в переменную — оно может устареть к моменту попытки навигации.