Различные маршруты для целевой страницы и панели инструментов в Angular2

Я занимаюсь разработкой сайта блога на Angular 2. Теперь я хочу показать форму регистрации / входа на целевой странице, когда пользователь, посещающий мой сайт, только в форме регистрации не будет отображаться меню или заголовок.

Теперь, когда пользователь вошел в систему, он будет перенаправлять на / панель инструментов и видеть меню, заголовок и контент

Теперь как начать. Можно ли использовать два роутера?

Изображение макета регистрации: http://prntscr.com/dwh1qg

Макет панели управления: http://prntscr.com/dwh2lp

Источник

1 ответ

Каждый компонент может содержать роутер-розетку.

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

Таким образом, вы можете иметь разные шаблоны для каждой группы компонентов.

@RouteConfig([
   { path: '/dahsboard/...', name: 'Dashboard', component: DashboardComponent },
   { path: '/...', name: 'Default', component: DefaultComponent }
])
export class AppComponent

Ваш шаблон для этого компонента может быть простым <router-outlet></router-outlet>,

Тогда ваши дочерние компоненты могут иметь разную маршрутизацию и разные шаблоны.

@RouteConfig([
   { path: '/home', name: 'Home', component: HomeComponent },
   { path: '/sign-up', name: 'SignUp', component: SignupComponent }
])
export class DefaultComponent

И его шаблон должен также содержать <router-outlet></router-outlet>,

Источник
Другие вопросы по тегам