Переход к последнему посещенному дочернему маршруту при входе в родительский маршрут Angular 5

В моем приложении Angular 5 мой маршрутизатор настроен следующим образом:

{
        path: 'system-variables',
        component: SystemVariablesComponent,
        children: [
          {
            path: '',
            redirectTo: 'partners-variables',
            pathMatch: 'full'
          },
          {
            path: 'partners-variables',
            component: PartnersVariablesComponent,
            children: [
              {
                path: '',
                redirectTo: 'partners-branches',
                pathMatch: 'full'
              },
              {
                path: 'partners-branches',
                component: PartnersBranchesComponent,
                children: [
                  {
                    path: '',
                    redirectTo: 'register-partners-branches',
                    pathMatch: 'full'
                  },
                  {
                    path: 'register-partners-branches',
                    component: RegisterPartnersBranchesComponent
                  },
                  {
                    path: 'registered-partners-branches',
                    component: RegisteredPartnersBranchesComponent
                  }
                ]
              },
              {
                path: 'partners-stores-categories',
                component: PartnersStoresCategoriesComponent,
                children: [
                  {
                    path: '',
                    redirectTo: 'register-partners-stores-categories',
                    pathMatch: 'full'
                  },
                  {
                    path: 'register-partners-stores-categories',
                    component: RegisterPartnersStoresCategoriesComponent
                  },
                  {
                    path: 'registered-partners-stores-categories',
                    component: RegisteredPartnersStoresCategoriesComponent
                  }
                ]
              }
            ]
          }
        ]

Как видите, когда я обращаюсь к '/', меня перенаправляют на '/partners-variables', который перенаправляет на '/partners-variables/partners-branches', а затем на '/partners-variables/partners-branches/register -партнеры-филиалы».

Внутри этого вложенного набора дочерних маршрутов можно перейти к нескольким различным путям, и этот код является лишь частью всего моего приложения.

Я пытаюсь загрузить последний посещенный дочерний маршрут при повторном посещении родительского компонента.

Например, если я посещаю: «/partners-variables/partners-branches/register-partners-branches», а затем изменяю дочерний маршрут на: «/partners-variables/partners-branches/registered-partners-branches», а затем Я меняю родительский маршрут на: '/partners-variables/partners-stores-categories' и, наконец, снова возвращаюсь к: '/partners-variables/partners-branches', по умолчанию (конфигурация маршрута) он перенаправляет меня на: '/ partner-variables/partners-branches/register-partners-branches», но мой последний посещенный маршрут внутри родительского маршрута «/partners-variables/partners-branches» был дочерним маршрутом «.../registered-partners-branches», и Я хотел бы восстановить его.

Предоставляет ли Angular 5 какие-либо встроенные функции для этого? Я мог бы создать его вручную, подписываясь на события изменения маршрута и сохраняя в памяти мои последние посещенные дочерние маршруты, но перед этим я хотел бы знать, возможно ли это в самом Angular.

Я не пытаюсь хранить все свои компоненты в памяти, ничего не связываю с routeReuseStrategy, просто отслеживаю мои последние посещенные дочерние маршруты для всех родительских маршрутов.

Спасибо!


person Felipe Micali    schedule 11.04.2018    source источник


Ответы (1)


Я не знаю, возможно ли это сделать изначально с конфигурацией маршрутизатора.

Но вы можете создать службу, используемую в каждом маршрутизируемом компоненте, для хранения совпадающего URL-адреса маршрута.
Затем в ngOnInit() каждого родительского компонента вызовите службу, чтобы получить последний сохраненный URL-адрес дочернего элемента, и вручную выполните маршрутизацию к этому.

В RegisterPartnersBranchesComponent:

ngOnInit() {
  this.myservice.storeRoute(this.router.url);
}

В родительских компонентах, таких как PartnersBranchesComponent:

ngOnInit() {
  // if you have to redirect (or everytime)
  if (this.router.url === '/partners-variables/partners-branches') {
     this.router.navigateByUrl(this.myservice.lastRoute);
  }
}

Возможно, вам придется объявить службу как синглтон с forRoot() в вашем модуле.

person Kapcash    schedule 11.04.2018
comment
Спасибо за ваш ответ! Да, я думаю, что это единственный возможный способ добиться этого. Я собираюсь реализовать это вручную =) - person Felipe Micali; 11.04.2018