Question

我正在使用angular，而routerLink有问题。当我单击表的tr标签导航到子组件时。网址仍显示子路线，但不显示子组件。希望有人帮助我。这是我的代码： Assign.component.html文件：

<a [routerLink]="['/abc']">go to ABC component</a>

assign.module.ts文件：

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { AssignComponent } from './assign.component';
import { AbcComponent } from './abc/abc.component';
import { RouterModule, Routes } from '@angular/router';

const routes: Routes = [
 {
  path: 'abc',
  component: AbcComponent
 }
]
@NgModule({
imports: [
  CommonModule,
  RouterModule.forRoot(routes)
],
declarations: [
  AssignComponent,
  AbcComponent
 ]
})
export class AssignModule { }

Answer 1

您是否已将<router-outlet></router-outlet>放在父组件的html中？如果否，那么将<router-outlet></router-outlet>放在父组件的html中。

谢谢。

Answer 2

将<router-outlet></router-outlet>放入您的父HTML文件中，如下所示：-

assign.component.html

<a [routerLink]="['/abc']">go to ABC component</a>

<router-outlet></router-outlet>

这是必需的，因为该路由是分配组件的子路由，并且当您导航到该子路由时，它需要在分配组件的HTML文件中放置一个位置。

希望，有帮助！

Answer 3

尝试将其写得尽可能简单：

<a routerLink="/abc">go to ABC component</a>

并且不要忘记添加父组件html文件（主要是app.component.html）。如果“分配”模块是abComponent的父组件，则尝试放入您的Assign.component.html文件。

谢谢

单击父组件中的元素时，不显示问题子组件

3 个答案: