14

我最近开始玩Angular2. 我一直试图让注射剂工作大约半天,但我仍然无法弄清楚我做错了什么。

为了尽可能简单,我复制了官方网页5 Min Quickstart中的代码。演示本身工作正常,但是当我尝试使用注射剂时,我收到一条错误消息

原始错误:无法解析 MyAppComponent 的所有参数。确保它们都具有有效的类型或注释。

我的打字稿文件

/// <reference path="typings/angular2/angular2.d.ts" />
import {Component, View, bootstrap,} from 'angular2/angular2';

class Names {}

// Annotation section
@Component({
    selector: 'my-app',
    injectables: [Names]
})
@View({
    template: '<h1>Hello {{ name }}</h1>'
})
// Component controller
class MyAppComponent {
    name: string;
    constructor(names: Names) {
        this.name = 'Alice';
    }
}

bootstrap(MyAppComponent);

PS 与5 分钟快速入门一样,我正在使用Traceur,SystemJSAngular2 alpha (23)

有谁知道我错过了什么?

4

2 回答 2

12

您的编译器不会将参数属性添加到MyAppComponent(通过查看您的pluker)。我认为这是问题所在。如果你添加

MyAppComponent.parameters = [[Names]]

那么一切都会很好。

  1. 是您的修复程序。
  2. 是 TS 中的相同示例(使用 ES6)

UPD感谢@GrayFox 指出正确的方法(见下面的评论):

供将来参考 - 使用--emitDecoratorMetadatatsc 时使用标志,emitDecoratorMetadata: true如果您使用 gulp-typescript,请添加到配置中

请在此处查看 TypeScript 编译器选项(您可以在此处emitDecoratorMetada找到)。

于 2015-05-15T06:13:18.040 回答
0

把这个:

 <PropertyGroup Condition=" '$(Configuration)' == 'Debug' " >
   <DebugSymbols>true < /DebugSymbols>
   < TypeScriptRemoveComments > false < /TypeScriptRemoveComments>
   < TypeScriptSourceMap > true < /TypeScriptSourceMap>
   < TypeScriptAdditionalFlags > $(TypeScriptAdditionalFlags)--emitDecoratorMetadata < /TypeScriptAdditionalFlags>
 < /PropertyGroup>
 < PropertyGroup Condition= " '$(Configuration)' == 'Release' " >
   <DebugSymbols>true < /DebugSymbols>
   < TypeScriptRemoveComments > true < /TypeScriptRemoveComments>
   < TypeScriptSourceMap > false < /TypeScriptSourceMap>
   < TypeScriptAdditionalFlags > $(TypeScriptAdditionalFlags)--emitDecoratorMetadata < /TypeScriptAdditionalFlags>
 < /PropertyGroup>

最后放入您的 *.njsproj 文件中。

于 2015-05-21T13:46:50.197 回答