Условная маршрутизация детей (угловая) - PullRequest
0 голосов
/ 31 января 2019

Можно ли условно отображать дочерний маршрут по умолчанию?

Я пытаюсь заставить пользователей приземляться на определенный дочерний маршрут, в зависимости от того, что они заказывали в прошлом (т. Е.земля на странице канала для магазина, онлайн или в социальных сетях).

Если они заказали в магазине, они переходят в дочерний маршрут магазина.
Если они не заказывали в магазине, они переходят в дочерний маршрут онлайн.
Если они не заказывали в магазине /Дитя, они переходят в Social.

Пользователь должен будет заказать с> 1 канала.

Ниже работает, но если я нажимаю с какой-то страницы на Channel, затем нажимаю Back наВ браузере страница канала отображается как пустая (т. е. кажется, что по умолчанию приложение использует пустую страницу для маршрутизатора-розетки.

Ниже находится мой модуль маршрутизатора

   {
      path: 'Channel/:id',
      component: ChannelComponent,
      children: [
        {
          path: 'Store', component: StoreComponent
        },
        {
          path: 'Online', component: OnlineComponent
        },
        {
          path: 'Social', component: SocialComponent
        }
      ]
    }

Ниже находится мой канал.component.ts

   ngOnInit(): void {
      this.orderedFromChannel= this.getTypes(this.userId); 
      if (this.orderedFromChannel['Store']) {
        this.showStore();
      } else if (this.orderedFromChannel['Online']) {
        this.showOnline();
      } else if (this.orderedFromChannel['Social']) {
        this.showSocial();
      } 
    }

      showStore() {
        this.router.navigate(["Store"], {relativeTo: this.route})
      }
      showOnline() {
        this.router.navigate(["Online"], {relativeTo: this.route})
      }
      showSocial() {
        this.router.navigate(["Social"], {relativeTo: this.route})
      }

Ниже от моего channel.component.html

<router-outlet></router-outlet>

1 Ответ

0 голосов
/ 31 января 2019

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

{
  path: 'Channel/:id',
  component: ChannelComponent,
  children: [
    {
      path: 'Store', component: StoreComponent
    },
    {
      path: 'Online', component: OnlineComponent
    },
    {
      path: 'Social', component: SocialComponent
    },
    {
      path: '', component: StoreComponent //if you want store to be default
    },
  ]
}

Или вы можете использовать перенаправление:

{
  path: 'Channel/:id',
  component: ChannelComponent,
  children: [
    {
      path: 'Store', component: StoreComponent
    },
    {
      path: 'Online', component: OnlineComponent
    },
    {
      path: 'Social', component: SocialComponent
    },
    {
      path: '', redirectTo: 'Store' //if you want store to be default
    },
  ]
}
...