I'm new to angular 5 and getting this error: Uncaught Error: Template parse errors:'employee-list' is not a known element:

I'm new to angular 5 and getting this error: Uncaught Error: Template parse errors:'employee-list' is not a known element:

我是 Angular 5 的新手,正在观看教程,讲师制作了两个组件,然后将它们的标签添加到 app.component.html

它在控制台中给我这个错误:

Uncaught Error: Template parse errors:
'employee-list' is not a known element:
1. If 'employee-list' is an Angular component, then verify that it is part of this module.
2. If 'employee-list' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. ("
</div>

教程中的相关视频: https://www.udemy.com/angular-mastering-the-basics/learn/v4/t/lecture/10121074?start=30

这是我的代码: app.component.html:

<!--The content below is only a placeholder and can be replaced.-->
<div style="text-align:center">
  <h1>
    Welcome to {{ title }}!
  </h1>
  
</div>

<employee-list></employee-list>

app.module.ts:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';
import { EmployeeListComponent } from './employee-list/employee-list.component';
import { EmployeeDetailComponent } from './employee-detail/employee-detail.component';

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

员工-list.component.ts:

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

@Component({
  selector: 'app-employee-list',
  templateUrl: './employee-list.component.html',
  styleUrls: ['./employee-list.component.css']
})
export class EmployeeListComponent implements OnInit {

  public employees;
  constructor() { }

  ngOnInit() {
  }

}

员工-list.component.html:

<p>
  employee-detail works!
</p>

我不明白出了什么问题以及如何解决?

改用<app-employee-list></app-employee-list>。 tag/selector 的名称在 employee-list.component.ts:

中指定
...
 selector: 'app-employee-list'
...

请记住,默认情况下 Angular 添加 app 作为前缀。所以你应该使用<app-employee-list></app-employee-list>。此外,如果您不确定,请查看组件的选择器。在您的情况下,这是您的选择器。 selector: 'app-employee-list',。随意更改,但建议命名。