对于我的应用程序模式，一旦我在app.module.ts文件中声明了我的LandingPageComponent，就可以将子模块导入其中。

我刚开始一个新项目，并认为其中一些模式是理所当然的。

假设你有一个组件:

product-list.component.ts:

import { Component } from '@angular/core';
    
    @Component({
        selector: 'pm-products',  
        templateUrl: './product-list.component.html'
    })
    
    
    export class ProductListComponent {
      pageTitle: string = 'product list';
    }

你会得到这个错误:

在src/app/app.com ponponts:6:3 -错误NG8001: 'pm-products' 不是已知元素: 如果'pm-products'是一个Angular组件，那么验证它是这个模块的一部分。

app.component.ts:

import { Component } from "@angular/core";
@Component({
  selector: 'pm-root', // 'pm-root'
  template: `
  <div><h1>{{pageTitle}}</h1>
  <pm-products></pm-products> // not a known element ?
  </div>
  `
})
export class AppComponent {
  pageTitle: string = 'Acme Product Management';
}

确保你导入了组件:

app.module.ts:

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

import { AppComponent } from './app.component';

// --> add this import (you can click on the light bulb in the squiggly line in VS Code)
import { ProductListComponent } from './products/product-list.component'; 

@NgModule({
  declarations: [
    AppComponent,
    ProductListComponent // --> Add this line here

  ],
  imports: [
    BrowserModule
  ],
  bootstrap: [AppComponent],


})
export class AppModule { }

我也有同样的问题。在尝试这里发布的一些解决方案之前，您可能需要检查组件是否真的不能工作。对我来说，这个错误显示在我的IDE (WebStorm)中，但当我在浏览器中运行它时，结果证明代码完美地工作了。

在我关闭终端(正在运行ng serve)并重新启动IDE之后，该消息停止显示。

这个复杂的框架快把我逼疯了。假设你在同一个模块的另一个组件部分的模板中定义了自定义组件，那么你不需要在模块中使用导出(例如app.module.ts)。你只需要在前面提到的模块的@NgModule指令中指定声明:

// app.module.ts

import { JsonInputComponent } from './json-input/json-input.component';

@NgModule({
  declarations: [
    AppComponent,
    JsonInputComponent
  ],
  ...

你不需要将JsonInputComponent(在本例中)导入到AppComponent(在本例中)来使用AppComponent模板中的JsonInputComponent自定义组件。你只需要在自定义组件前加上两个组件都定义过的模块名(例如app):

<form [formGroup]="reactiveForm">
  <app-json-input formControlName="result"></app-json-input>
</form>

注意app-json-input不是json-input!

演示在这里:https://github.com/lovefamilychildrenhappiness/AngularCustomComponentValidation

对于我的应用程序模式，一旦我在app.module.ts文件中声明了我的LandingPageComponent，就可以将子模块导入其中。

我刚开始一个新项目，并认为其中一些模式是理所当然的。

我花了半天时间来解决这个问题。问题出在进口方面。我的HomeModule有html中包含的homeComponent。ProductComponent是ProductModule的一部分。我在导入中添加了ProductModule到HomeModule，但忘记在导入中添加HomeModule到AppModule。添加后，问题消失了