Angular2 - Fehler erhalten als: `AUSNAHME: Keine Richtlinie Anmerkung gefunden auf MyComponent`

Question

Wenn ich versuche, eine Anweisung aus einer anderen Datei zu importieren, erhalte ich den Fehler EXCEPTION: No Directive annotation found on MyComponent - wie man das löst?

hier ist mein Code:

app.component.ts:

import {Component} from 'angular2/core'; 
import {MyComponent} from "./app.my-component" 

@Component({ 
    selector: 'app', 
    template: ` 
     <h1>Hellow World</h1> 
     <span>Here is your component:</span> 
     <my-component></my-component> 
    `, 
    directives: [MyComponent] 
}) 

export class AppComponent { } 

app.mycomponent.ts:

import {Component} from 'angular2/core'; 

@Component({ 

    selector : 'my-component', 

    template : `<h2>This is from My component</h2>` 

}); 

export class MyComponent { }; 

Aber ich bin immer Fehler wie: No Directive annotation found on MyComponent wie zu lösen Dies?

Answer 1

Sie sollten ; nach Schließen der Komponente Component Direktive Klammer entfernen.

import {Component} from 'angular2/core'; 

@Component({ 

selector : 'my-component', 

template : `<h2>This is from My component</h2>` 

}) 
export class MyComponent { }; 

Answer 2

Vielleicht müssen Sie stattdessen einen relativen Pfad erstellen. Es hängt davon ab, wo die Komponente, die Sie importieren möchten, ist relativ befindet, um das Skript Sie die Komponente importieren in. So etwas wie

import {MyComponent} from "../app.my-component"

oder

import {MyComponent} from "./app.my-component".

Es wäre hilfreich, wenn Sie auch Ihre Ordnerstruktur gepostet haben.

Answer 3

oke, ich lerne auch immer noch dazu, aber ich habe die gleiche Nachricht wie Sie. Ich glaube, ich löste es ...

fand meine Antwort hier: https://angular.io/docs/ts/latest/guide/attribute-directives.html

diese zu Ihrem app.mycomponent.ts hinzufügen:

import {Directive} from 'angular2/core'; 

und die Richtlinie hinzufügen:

@Directive({ 
    selector: '[MyComponent]' 
}) 

hoffe das hilft dir ein bisschen.

wieder nicht sicher, ob dies der richtige Weg ist ...

Answer 4

In meinem Fall war es ein Problem mit dem Export einer bestimmten Klasse, und der Einfuhr dieser Klasse in anderen Komponenten.

Dieser Fehler wurde jedoch nicht explizit angezeigt, sondern als Ausnahme in EXCEPTION: No Directive annotation... in der Konsole.

Um ausdrücklich diesen Fehler zu erhalten:

1. Stoppen Sie den lokalen Server
2. Re-run npm start

eventuelle Mängel, die vorher versteckt (die Winkelquickstart Setup vorausgesetzt) ​​sind, werden sofort auftauchen.