Использование роутера-розетки в пределах oop в angular - PullRequest
Новая
       4

Использование роутера-розетки в пределах oop в angular

1 голос
/ 23 февраля 2020

Я сталкиваюсь с очень сложной ситуацией. Я определил несколько маршрутов, которые сопоставлены с различными компонентами в моем приложении. Я хочу загрузить компонент, соответствующий данному маршруту, в <router-outlet>, что не должно быть проблемой в обычном сценарии ios. Но на этот раз я хочу использовать <router-outlet> в настраиваемом компоненте списка, как показано ниже. Это создает несколько экземпляров <router-outlet>, что вызывает проблемы, и компонент не загружается. 

<list*ngFor="let cat of settings">
  <list-item *ngFor="let item of cat.items" 
      [routerLink]="cat.route + item.route" queryParamsHandling="merge">
    <router-outlet></router-outlet>
  </list-item>
</list>

Код ниже просто отлично работает. Но компонент загружается вне списка компонентов. Что нежелательно. 

<list*ngFor="let cat of settings">
  <list-item *ngFor="let item of cat.items" 
     [routerLink]="cat.route + item.route" queryParamsHandling="merge">
  </list-item>
</list>
<router-outlet></router-outlet>

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

<list*ngFor="let cat of settings">
  <list-item *ngFor="let item of cat.items" 
     [routerLink]="cat.route + item.route" queryParamsHandling="merge">
    <custom-component></custom-component>
  </list-item>
</list>

Или есть просто способ динамически определить компонент на основе маршрута и внедрить в шаблон.

...