时间戳

首页 > 解决方案 > 角度路由 - 组件未显示

angular - 角度路由 - 组件未显示

问题描述

我一直在尝试从我的主页路由以加载其他 HTML 组件，但它不起作用。当地址更改为我设置的地址时，主页不断显示-

app.module.ts 如下：

@NgModule({
  declarations: [
    AppComponent,
    RegisterComponent,
    TabsComponent,
    AboutComponent,
    LessonsComponent
  ],
  imports: [
    RouterModule.forRoot([

      { path: 'tabs', component: TabsComponent},
      { path: 'register', component: RegisterComponent},
      { path: 'lessons',component: LessonsComponent},
      { path: 'about', component: AboutComponent},
      { path: 'app',component: AppComponent},
    ]),

这些是我在 app.component.html 中的链接：

<div>
    <ul class="navbar">
          <li><a routerLink="/register" routerLinkActive="active">Register</a></li>
          <li><a routerLink="/tabs" routerLinkActive="active">Tabs</a></li>
          <li><a routerLink="/app" routerLinkActive="active">Home</a></li>
          <li><a routerLink="/lessons" routerLinkActive="active">Lessons</a></li>
          <li style="float:right"><a routerLink="/about" routerLinkActive="active">About</a></li>
      </ul>
</div>

例如，如果我按下注册链接，我将进入“ http://localhost:4200/register ”，但它仍保留在 app.component.html

标签： angularrouting

解决方案

试试这个stackblits 示例代码

推荐阅读