2017-05-12 14 views
13

Angular2 'de yeniim. Bir bileşen oluşturmaya çalıştım ama bir hata gösteriyor. '<selector>' bir Açısal bileşen ise, bu modülün bir parçası olduğunu doğrulayın.

Bu

app.component.ts dosyasıdır.

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' } 

Oluşturmak istediğim bileşen budur.

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

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

export class MyComponentComponent { 

} 

Gösterilen iki hata: my-component bir Açısal bileşenidir

  1. , o zaman bu modülün bir parçası olduğundan emin olun.
  2. my-component Bir Web Bileşeni sonra bu mesajı bastırmak için bu bileşenin @NgModule.schemas için CUSTOM_ELEMENTS_SCHEMA eklemektir.

Yardım edin.

cevap

4

Eğer direktifleri biraz şöyle senin app.module.ts aktardığınızda ve kaldırmak gibidir: -

@NgModule({ 
    bootstrap: [AppComponent], 
    imports: [MyComponentModule],// or whatever the name of the module is that declares your component. 

    declarations: [AppComponent], 
    providers: [] 
}) 
export class AppModule {} 

Sizin MyComponentModule böyle olmalı: -

@NgModule({ 
    imports: [], 
    exports: [], 
    declarations: [MyComponentComponent], 
    providers: [], 
}) 
export class MyComponentModule { 
} 
5

Sizin "MyComponentComponent" olmalıdır " MyComponentModule".

Ve "MyComponentModule" ise, "ihracat" içeride "MyComponentComponent" yerleştirmelidir içinde

.

Böyle bir şey, aşağıdaki kodu bakın.

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

export class MyComponentModule { 
} 

ve bunun gibi "app.module.ts" nde "ithalat" (aşağıdaki kodu bakın) "MyComponentModule" koy.

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

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

export class AppModule {} 

Bunu yaptıktan sonra, bileşeninizin seçicisi artık uygulama tarafından tanınabiliyor. https://angular-2-training-book.rangle.io/handout/modules/feature-modules.html

: Cheers Burada bu konuda daha fazla bilgi edinebilirsiniz

!

2

Belki bu Sen bu <app-mycomponent></app-mycomponent>

kullanmalıdır bu <mycomponent></mycomponent>

gibi html şey kullanmak

html etiket bileşeninin adı içindir

İlgili konular