#routes #angular-module #angular12 #router-outlet
Вопрос:
У меня есть одна главная страница модуля с тремя компонентами: навигационная панель, нижний колонтитул, главная страница. Я хочу показать страницу главной страницы с фиксированной навигационной панелью и нижним колонтитулом и хочу использовать розетку маршрутизатора для отображения компонента home и других компонентов на главной странице. Но когда я перехожу к «/home», он показывает компонент home в розетке маршрутизатора app.component. мое приложение-routing.module.ts выглядит так:-
import { NgModule } from '@angular/core'; import { RouterModule, Routes } from '@angular/router'; const routes: Routes = [ { path: '', loadChildren: () =gt; import('./auth/auth.module').then((m) =gt; m.AuthModule), }, { path: 'dashboard', loadChildren: () =gt; import('./masterpage/masterpage.module').then((m) =gt; m.MasterpageModule), }, ]; @NgModule({ imports: [RouterModule.forRoot(routes)], exports: [RouterModule], }) export class AppRoutingModule {}
masterpage.component.html похоже на:-
lt;app-navbargt;lt;/app-navbargt; lt;router-outletgt;lt;/router-outletgt; lt;app-footergt;lt;/app-footergt;
masterpage-routing.module.ts выглядит так:-
import { NgModule } from '@angular/core'; import { RouterModule, Routes } from '@angular/router'; import { HomeComponent } from './home/home.component'; import { MasterpageComponent } from './masterpage.component'; const routes: Routes = [ { path: '', component: HomeComponent }, ]; @NgModule({ imports: [RouterModule.forChild(routes)], exports: [RouterModule], }) export class MasterpageRoutingModule {}
когда я перехожу на локальный хост:4200/панель мониторинга, она показывает только
надомные работы!
Но я хочу
navbar-работает!
надомные работы!
нижний колонтитул-работает