Angular2 - 獲取錯誤：`EXCEPTION：在MyComponent上找不到指令注釋

Question

當我嘗試從其他文件導入指令時，我得到錯誤為EXCEPTION: No Directive annotation found on MyComponent - 如何解決這個問題？

這是我的代碼：

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 { };

但我得到的錯誤是： No Directive annotation found on MyComponent如何解決這個問題？

Answer 1

你應該刪除; 組件關閉后， Component指令括號。

import {Component} from 'angular2/core';

@Component({

selector : 'my-component',

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

})
export class MyComponent { };

Answer 2

也許你必須做一個相對路徑。 它取決於您要導入的組件相對於要導入組件的腳本的位置。類似於

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

要么

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

如果您也發布了文件夾結構，這將有所幫助。

Answer 3

哦，我還在“學習”這個，但我得到了和你一樣的信息。 我想我解決了......

在這里找到我的答案： https ： //angular.io/docs/ts/latest/guide/attribute-directives.html

將此添加到您的app.mycomponent.ts：

import {Directive} from 'angular2/core';

並添加指令：

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

希望這對你有所幫助。

再次，不確定這是否正確...

Answer 4

在我的例子中，特定類的導出存在問題，並且在其他組件中導入該類。

但是這個錯誤沒有明確顯示，而是在控制台中表現為EXCEPTION: No Directive annotation...中的異常。

為了明確地得到這個錯誤：

1. 停止本地服務器
2. 重新運行npm start （假設Angular快速入門設置）

之前隱藏的任何當前錯誤都會立即顯示。