如何解决“路由器插座”不是已知元素的问题？答案

【问题标题】：How to solve a problem 'router-outlet' is not a known element?如何解决“路由器插座”不是已知元素的问题？
【发布时间】：2026-02-13 03:30:02
【问题描述】：

我有应用模块和共享模块。在应用路由模块中，我有：

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { SiteLayoutComponent } from "./shared/layouts/site-layout/site-layout.component";
import { LoginPageComponent } from "./components/login-page/login-page.component";

const routes: Routes = [
  {
    path: '',
    component: SiteLayoutComponent,
    children:
      [{path: 'login', component: LoginPageComponent}]
  }
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})

export class AppRoutingModule {}

在 app.component.ts 中：

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  template: '<router-outlet></router-outlet>'
})
export class AppComponent {
  title = 'TheEda';
}

在共享模块中：

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';

import { HeaderComponent } from './layouts/header/header.component';
import { SiteLayoutComponent } from './layouts/site-layout/site-layout.component';


@NgModule({
  declarations: [
    HeaderComponent,
    SiteLayoutComponent
  ],
  imports: [
    CommonModule,
  ]
})
export class SharedModule { }

还有在 site-layout.component.html 中的站点布局组件的共享模块中：

<router-outlet></router-outlet>

我有一个错误：src/app/shared/layouts/site-layout/site-layout.component.html:1:1 - error NG8001: 'router-outlet' is not a known element。如何解决这个问题？我的代码中缺少什么？

【问题讨论】：

可能缺少导入 ... RouterModule.forRoot(routes) ... BrowserModule ... 其中路由可能看起来像 ... const routes: Routes = [ { path: 'main', loadChildren: () => import('./routes/main/main.module').then(m => m.MainModule) }, {path: '**', redirectTo: '/main'} ]
您的AppRoutingModule 似乎没有包含在主文件中
这能回答你的问题吗？ 'router-outlet' is not a known element

标签： angular

【解决方案1】：

您的AppRoutingModule 似乎错过了注册AppModule。
尝试将AppRoutingModule 导入AppModule 看看。

如果您仍然看到同样的问题，请尝试在堆栈闪电战中分享整个代码。

【讨论】：