Мой Ionic 4 (.12) -Проект с Angular 7.2.4 испытывает некоторые проблемы с угловым маршрутизатором. В настоящее время у меня есть боковое меню с возможностью навигации по 3 различным страницам.
- Страница 1 содержит три вкладки
- Страница 2 и 3 удерживают одну страницу
- В Page 1 содержимое вкладок создается динамически .
Я хочу, чтобы Page 1 и Page 2 были братьями и сестрами, поэтому я перемещаюсь между такими как:
<ion-item *ngFor="let item of navList" [routerLink]="item.link" routerDirection="root">
<ion-label> {{ item.label }} </ion-label>
ion-icon [name]="item.icon" slot="start"></ion-icon>
</ion-item>
Страница 3 является дочерней страницей и должна иметь кнопку возврата назад, которая отображает предыдущую страницу:
<ion-item routerLink="/page3" routerDirection="forward">
<ion-label> Page 3 </ion-label>
<ion-icon name="airplane" slot="start"></ion-icon>
</ion-item>
Пока все хорошо. Но при перемещении между Страницей 1 и Страницей динамически создаваемый контент Страницы 1 теряется. (Я предполагаю, что состояние страницы отбрасывается или , новая страница создается и помещается в стек навигации.)
Мой вопрос: Как сохранить динамически созданный контент, но при этом перейти на страницу с routerDirection="root"
?
Дополнительно код:
const routes: Routes = [
{ path: '', redirectTo: '/page1', pathMatch: 'full' },
{ path: 'page1', loadChildren: './gui/page1/page1.module#Page1Module' },
{ path: 'page2', loadChildren: './gui/page2/page2.module#Page2Module' },
{ path: 'page3', loadChildren: './gui/page3/page3.module#Page3Module' }
];
Динамические компоненты создаются с ViewContainerRef
в списке и ComponentFactoryResolver
.
EDIT
Я достиг относительной близости, используя:
this.router.navigate([item.link], { relativeTo: this.route });