路由器出口内的角度组件未知

Question

上下文

我用这个配置创建了一个有角度的应用程序：

? What name would you like to use for the new workspace and initial project? test-route
? Would you like to add Angular routing? Yes
? Which stylesheet format would you like to use? SCSS   [ https://sass-lang.com/documentation/syntax#scss

我创建了两个组件，它们非常简单

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

@Component({
selector: 'app-first',
templateUrl: './first.component.html',
})
export class FirstComponent { }

在html中只有一个简单的文本

First Component

第二个组件基本相同，但我用第二个替换了第一个。

我为我的第一个组件创建了一条路线。

const routes: Routes = [
{ path: 'first-component', component: FirstComponent },
];

我想做什么

然后我想在第一个的html中添加我的第二个组件

First Component
<app-second></app-second>

我还在app.module.ts中添加了我的第二个组件

@NgModule({
declarations: [
AppComponent,
SecondeComponent
],
imports: [
BrowserModule,
AppRoutingModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }

问题

当我这样做的时候，我有一个错误

错误NG8001:"应用程序秒"不是已知元素：

1. 如果"app-second"是Angular组件，则验证它是否是该模块的一部分
2. 如果"app second"是Web组件，则将"CUSTOM_ELEMENTS_SCHEMA"添加到此组件的"@NgModule.schemas"中以取消显示此消息

我还尝试直接在app.component.html中添加第二个组件，但没有出现错误。如何使用路由中的自定义组件？

以下是堆叠式的示例

Answer 1

如果您还在AppModule中将FirstComponent添加到declarations阵列中，则不会出现错误

declarations: [AppComponent, SecondeComponent, FirstComponent],