Сделать маршрут по умолчанию для вложенного маршрута - [Angular] - PullRequest
Новая
       18

Сделать маршрут по умолчанию для вложенного маршрута - [Angular]

0 голосов
/ 08 апреля 2019

В моем проекте Angular-6 я хочу, чтобы маршрут по умолчанию был вложенным.Это означает, что если пользователь нажмет " localhost: 4200 " в браузере, он будет перенаправлен на " localhost: 4200 / dashboard / headlines ".Я написал ниже конфигурацию маршрута, но она не работает.1. что я делаю не так?2. Можно ли реализовать то же самое для модуля отложенной загрузки? 

const routes: Routes = [
  {
    path: '',
    redirectTo: '/dashboard',
    pathMatch: 'full'
  },
  {
    path: 'dashboard',
    component: NewsComponent,
    children: [
      { path: '', redirectTo: '/headlines', pathMatch: 'full' },
      { path: 'headlines', component: HeadLinesComponent },
      { path: 'detail', component: DeatilNewsComponent }
    ]
  }
]

news.component.html 

<div>News Work</div>
<router-outlet></router-outlet>

app.component.html 

<router-outlet></router-outlet>

Ответы [ 2 ]

0 голосов
/ 08 апреля 2019

Вот ваше Рабочее демо Stackblitz

Измените ваш app.routing.ts на код ниже: ~ 

import { Routes } from '@angular/router';
import { NewsComponent } from './news.component';
import { HeadLinesComponent } from './head-lines.component';

export const routes: Routes = [
  {
    path: '',
    redirectTo: 'dashboard',
    pathMatch: 'full'
  }, {
    path: 'dashboard',
    component: NewsComponent,
    pathMatch: 'prefix',
    children: [
      { path: '', redirectTo: 'headlines', pathMatch: 'full' },
      { path: 'headlines', component: HeadLinesComponent }
    ]
  }
];

Точный дубликат здесь

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

Ознакомьтесь с официальной угловой документацией

Надеюсь, это поможет.

0 голосов
/ 08 апреля 2019

Конвертируйте ваши маршруты в это: 

const routes: Routes = [
  {
    path: '',
    redirectTo: 'dashboard',
    pathMatch: 'full'
  },
  {
    path: 'dashboard',
    component: NewsComponent,
    children: [
      { path: '', redirectTo: 'headlines', pathMatch: 'full' },
      { path: 'headlines', component: HeadLinesComponent }
    ]
  }
]

Рабочий пример здесь

...