根组件内的Angular 2自定义组件崩溃应用

Question

在学习Angular 2时，我一直试图解决这个问题似乎很容易。创建一个组件，然后将该组件放在根组件中。当我不添加其他组件时，页面加载。当我在我的自定义组件中导入并将指令添加到根组件时，页面将保持加载状态并且不会从那里开始，就像崩溃一样。我似乎无法弄明白。

我的自定义组件（my-c.component.ts）：

import {component} from 'angular2/core'; 

@component({
    selector: 'my-comp',
    template: `
        <h3>Second component</h3>
    `
    })

export class mycComponent {

}

现在这是插入我的自定义组件的“root”组件。 （app.component.ts）

import {Component} from 'angular2/core';
import {mycComponent} from './my-c.component';


@Component({
    selector: 'my-app',
    template: `
        <h1>Angular 2 Boilerplate (o yea)</h1>
        <h2>Now comes the second component</h2>
        <my-comp></my-comp>
    `,
    directives: [mycComponent]

})

export class AppComponent {

}

在我的index.html文件中没有简单的所有标题。 这不包括polyfill的所有包含以及用于“启动”应用程序的system.config，这些都在那里。

<my-app>Loading...</my-app>

当我取出导入我的自定义组件并删除该指令时，我得到了这个：

当我将指令[mycComponent]添加到根组件中时会发生这种情况。

这是我希望看到的index.html的图片。

这似乎应该是最容易理解和工作的事情之一，但由于某种原因，我被困在这里。

如果你认为它可能不起作用，我将不胜感激：（

文件结构＆gt;

Answer 1

你的第二个组件@Component装饰器可能是小写的“c”吗？