Автоматически перейти к первому routerLink в * ngFor?

Question

У меня есть «подача» различных предметов (разных компонентов).Каждый из них имеет routerLink, который изменяет представление в выходной точке маршрутизатора рядом с фидом.Я хочу перейти к первому элементу в канале при его инициализации.

<div class="item-container">
  <ng-container
        *ngFor="let feedItem of items"
        [ngSwitch]="feedItem.type"
      >
        <component-1
          [routerLink]="['type1', feedItem.item.id]"
          [routerLinkActive]="'active'"
          ...
          *ngSwitchCase="FeedItemType.Type1"
        ></component-1>
        <component-2
          [routerLink]="['type2', feedItem.item.id]"
          [routerLinkActive]="'active'"
          ...
          *ngSwitchCase="FeedItemType.Type2"
        ></component-2>
  </ng-container>
</div>

Answer 1

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

const routes: Routes = [
    {
        path: 'parent',
        component: ParentComponent,
        children: [
            { path: '', redirectTo: 'type1', pathMatch: 'full' },   // <--- default child route
            { path: 'type1', component: Type1Component },
            { path: 'type2', component: Type2Component },
        ],
    },
];

Поэтому при переходе к /parent он автоматически перенаправляется на /parent/type1.

Answer 2

Спасибо @ zyz , я смог решить эту проблему следующим образом:

@ViewChildren(RouterLink) feedItems: QueryList<RouterLink>;

...

ngAfterViewInit(): void {
  this.feedItems.changes.pipe(take(1)).subscribe(items => {
    if (items.first) {
      this.router.navigateByUrl(items.first.urlTree);
    }
  });
}