如果”是Angular组件,则验证它是否是此模块的一部分

发布时间：2020-12-17 07:53:12 所属栏目：安全来源：网络整理

导读：我是Angular2的新手.我试图创建一个组件,但显示错误. 这是app.component.ts文件. import { Component } from '@angular/core';import { MyComponentComponent } from './my-component.component';@Component({ selector: 'my-app',template: ` h1Hello {{nam

我是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以禁止显示此消息.

请帮忙.

您的“MyComponentComponent”应位于“MyComponentModule”中.

在“MyComponentModule”中,您应该将“MyComponentComponent”放在“exports”中.

像这样的东西,见下面的代码.

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

export class MyComponentModule {
}

并将“MyComponentModule”放在“app.module.ts”中的“imports”中(如下所示).

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

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

export class AppModule {}

完成后,应用程序现在可以识别组件的选择器.

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

干杯!

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!