为什么你好世界文字不显示?

时间:2016-01-13 15:16:12

标签: angular angular2-template

我是 Angular 2 的新手。我看过这个视频 https://egghead.io/lessons/angular-2-say-hello-world-to-angular-2

现在我想在plunker上做同样的演示,我试过这样

http://plnkr.co/edit/uQa9ZIvb38iTMaXsecaC?p=preview

请告诉我哪里做错了

//代码在这里

import {bootstrap} from 'angular';
import {Component} from 'angular2/core';


@Component({
  selector:'app',
  template:'<div>hello</div>'

})

class App{}


bootstrap(App)

2 个答案:

答案 0 :(得分:1)

将此添加到您的html代码中。这是官方example

<script>
  System.config({
    transpiler: 'typescript', 
    typescriptOptions: { emitDecoratorMetadata: true }, 
    packages: {'app': {defaultExtension: 'ts'}} 
  });
  System.import('app/boot')
        .then(null, console.error.bind(console));
</script>

修改

您可以在这里找到工作示例plunker

修改

更新了plunker。您还必须将包文件放在独立文件夹中。

答案 1 :(得分:1)

Here a working plunker

你应该记住的事情:

  • 使用System.import('file.ts')时,您无需<script src="file.ts">
  • 使用System.config
  • 确保transpiler: 'typescript'

希望这会有所帮助。