JSFiddle上的Angular2 –如何包含.ts文件? [英] Angular2 on JSFiddle – How to include .ts file?

问题描述

我是第一次使用jsFiddle.我不知道如何在其中包含所有文件.当前，在运行小提琴时，它会返回404.如何链接本地ts文件以使其运行.

I am using jsFiddle for the first time. I do not know how to include all my files in it. Currently when running the fiddle it returns a 404. How do i link my local ts file to make it run.

我的小提琴位于此处.任何帮助将不胜感激.

My fiddle is located here. Any help would be greatly appreciated.

<script>document.write('<base href="' + document.location + '" />');</script>
 <script>
    System.config({
      transpiler: 'typescript',
      typescriptOptions: { emitDecoratorMetadata: true },
      packages: {'app': {defaultExtension: 'ts'}} 
    });
  System.import('app/main')
        .then(null, console.error.bind(console));
</script>

这将返回:

angular2-polyfills.js:1243错误:正在加载XHR错误(找不到404) https://fiddle.jshell.net/Unnati/kje2sr61/show/app/main.ts (…)

angular2-polyfills.js:1243 Error: XHR error (404 NOT FOUND) loading https://fiddle.jshell.net/Unnati/kje2sr61/show/app/main.ts(…)

推荐答案

这是一个在plunker中的Angular2入门项目:

Here's an Angular2 starter project in a plunker: http://plnkr.co/edit/F5lDxrDUFlNQQZimUhk9?p=preview

通过简单的AppComponent

@Component({
  selector: 'my-app',
  template: `
  <h2>Hello World</h2>`,
  providers: []
})
export class App implements ngAfterViewInit{
  name:any;

  constructor() {}

  ngAfterViewInit(){
  }
}

所有system.config类型的配置均已设置.如果要更改它并保存以备后用，只需单击屏幕顶部的叉子".

all system.config type of configs are set. If you want to change it and save for later use just click "Fork" at the top of the screen.

更新:Plunker现在具有Angular 2.0.x的默认模板选项.

Update: Plunker now has a default template option for Angular 2.0.x

您可以单击新建"->角度"-> 2.0.x右侧的箭头

You can click the arrow the right of New -> Angular -> 2.0.x

这篇关于JSFiddle上的Angular2 –如何包含.ts文件?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！