如果 '' 是一个 Angular 组件，然后验证它是这个模块的一部分

小编典典

如果 '' 是一个 Angular 组件，然后验证它是这个模块的一部分

all

我是 Angular2 的新手。我试图创建一个组件但显示错误。

这是app.component.ts文件。

import { Component } from '@angular/core';
import { MyComponentComponent } from './my-component.component';

@Component({
  selector: 'my-app',
  template: `
    <h1>Hello {{name}}</h1>
    <h4>Something</h4>
    <my-component></my-component>
  `,
  directives: [MyComponentComponent]
})
export class AppComponent { name = 'Sam' }

这是我要创建的组件。

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

@Component({
selector: 'my-component',
template: `
    <p>This is my article</p>
`
})

export class MyComponentComponent {

}

显示两个错误：

如果my-component是 Angular 组件，则验证它是否是此模块的一部分。
如果my-component是 Web 组件，则添加CUSTOM_ELEMENTS_SCHEMA到此@NgModule.schemas组件的以禁止显示此消息。

请帮忙。

阅读 86

2022-06-21

共1个答案

小编典典

你MyComponentComponent应该在MyComponentModule.

而在MyComponentModule，你应该把MyComponentComponent里面的“出口”。

像这样的东西，见下面的代码。

@NgModule({
   imports: [],
   exports: [MyComponentComponent],
   declarations: [MyComponentComponent],
   providers: [],
})

export class MyComponentModule {
}

并像这样放置在MyComponentModule中imports（app.module.ts参见下面的代码）。

import { MyComponentModule } from 'your/file/path';

@NgModule({
   imports: [MyComponentModule]
   declarations: [AppComponent],
   providers: [],
   bootstrap: [AppComponent]
})

export class AppModule {}

这样做之后，您的组件的选择器现在可以被应用程序识别。

你可以在这里了解更多信息：https ://angular-2-training-
book.rangle.io/handout/modules/feature-
modules.html

2022-06-21