Как восстановить / уничтожить компонент в Angular-6
Можете ли вы проверить наличие экземпляра компонента из самого компонента?
Можете ли вы уничтожить существующий экземпляр и создать новый экземпляр?
Кажется, у меня проблема с одним из моих компонентов. NgAfterViewInit запускается несколько раз подряд с различными компонентами params, запускается только в первый раз (я предполагаю, когда компонент был создан). Последующие посещения не вызывают срабатывание ngAfterViewInit, т. Е. Выглядит так, как будто он повторно использует тот же экземпляр компонента или что-то... однако я могу определить параметры и выполнить необходимые действия с измененными параметрами.
Однако, если я посещаю новый маршрут и возвращаюсь к рассматриваемому маршруту / компоненту, он работает нормально. и я вижу, что он разрушается до начала нового маршрута и соответствующего компонента.
Моя цель состоит в том, чтобы восстановить компонент КАЖДЫЙ РАЗ, когда я посещаю маршрут.
Так
Можете ли вы проверить наличие экземпляра компонента из самого компонента?
Можете ли вы уничтожить существующий экземпляр из кода и создать новый экземпляр?
Или есть другой способ решения этой проблемы.
Моя настройка
Ленивый загруженный модуль -> MDM
const routes: Routes = [
{
path: '',
component: HomeComponent,
children : [
{ path: ':id' , component : AComponent }
]
}
Меню AnchorLinks
- MDM /1000
- MDM /2000 и т. д. и т. д.
1 ответ
Есть определенно другой способ сделать это.
Чтобы ответить вам, вы, вероятно, можете проверить существование экземпляра компонента, и, возможно, вы можете воссоздать его по требованию.
Но ты не должен.
Это не только излишне, но вы также должны позволить Angular управлять инжекторами, иначе (если вы не знаете, что делаете), вы столкнетесь с некоторыми забавными проблемами.
Чтобы кратко объяснить вам: перезагрузка маршрута не запускает жизненный цикл компонента. Жизненный цикл компонента начинается, когда он создается, и заканчивается, когда он уничтожается (что означает "больше не в DOM").
Когда вы перезагружаете маршрут, компонент не уничтожается, следовательно, ваша проблема.
Чтобы решить эту проблему, подпишитесь на события изменения маршрута в вашем хуке жизненного цикла:
ngAfterViewInit() {
this.router.events
.pipe(filter(event => event instanceof NavigationEnd))
.subscribe(event => /* do something */);
}
Я передал наблюдаемому только прослушивание последнего события стека (иначе ваша подписка будет выполняться много раз).