Как ПРАВИЛЬНО очистить сервисы Angular при деактивации маршрута
Decoded Frontend
0:00 / 0:00
Как ПРАВИЛЬНО очистить сервисы Angular при деактивации маршрута
4 213 просмотров · 4 месяца назад
Decoded Frontend
64,9 тыс. подписчиков
4 213 просмотров · 4 месяца назад
🤖 Позвольте ИИ автоматически тестировать ваши приложения с помощью TestSprite. Попробуйте БЕСПЛАТНО — https://www.testsprite.com/?via=decoded
По умолчанию, когда пользователь переходит на другой маршрут, Angular навсегда сохраняет в памяти инжектор маршрута — и все его сервисы. В этом видео я покажу вам, как это исправить, используя новую функцию маршрутизатора `withExperimentalAutoCleanupInjectors`, которая была представлена в Angular 21.1.
Мы рассмотрим:
— Почему инжекторы маршрутов по умолчанию сохраняются в памяти
— Почему существующие обходные пути неэффективны
— Как работает ExperimentalAutoCleanupInjectors и как его включить
— Как использовать DestroyRef для очистки, если вы не являетесь владельцем сервиса
— Что делать, если вы используете пользовательскую RouteReuseStrategy
Связанные видео:
→ provideEnvironmentInitializer — • Angular Service Initialization done RIGHT ...
→ Объяснение инжекторов на уровне маршрутов — • Providers in Angular Route - New Feature i...
→ Отладка утечек памяти в Angular — • How To Detect Memory Leaks In Your Web App...
→ Когда canDeactivate действительно имеет смысл — • How To Detect Memory Leaks Pt.2 — Detached...
→ Подробнее о DestroyRef — • The new DestroyRef Provider in Angular 16 ...
🌱🤝 СТАНЬТЕ УЧАСТНИКОМ КАНАЛА
Получите доступ к эксклюзивному контенту и поддержите канал, став участником:
Patreon - / decodedfrontend
YouTube Membership - / @decodedfrontend
🔗 РЕСУРСЫ
Код из руководства на GitHub: https://github.com/DMezhenskyi/angula...
Сообщество Angular в Discord (БЕСПЛАТНО): https://bit.ly/decoded-frontend-discord
💡 Чтобы получить больше советов по Angular, также подписывайтесь:
LinkedIn - / dmezhenskyi
Twitter - / decodedfrontend
Instagram - / decodedfrontend
⏱️ ВРЕМЕННЫЕ МЕТКИ
00:0:00 Вступление
00:01:47 Проблема
00:03:55 Решение
00:05:07 Дополнительный совет 1
00:06:40 Дополнительный совет 2
00:07:48 Итоги
00:09:31 Как тестировать приложения с помощью ИИ
00:13:39 Интеграция спонсорства
00:11:04 Заключение
#angular #ng #angulartutorial #angulardevelopment #environmentinitializer #appinitializer #angularservices