打字稿模块和systemjs。从内联脚本实例化类

时间:2016-03-30 15:19:47

标签: javascript typescript systemjs

我正在使用系统模块选项将一个打字稿模块转换为javascript。我正在浏览器中执行此操作。

当初始化typescript生成的模块类的代码也使用systemjs system.import加载时,我能够使用这个模块。

如何通过systemjs加载javascript代码中可用的模块的一部分?例如。在页面中嵌入了javascript?

1 个答案:

答案 0 :(得分:3)

您可以使用 SystemJS 在Javascript中导入模块。

假设您有一个名为 app.ts 的模块,该模块会导出名为 value 的变量。

app.ts:

export let value = 'ABCASF';

在脚本标记中,您可以写:

System.import('app.js').then(function(appModule) {
  console.log(appModule.value);
}, console.error.bind(console));

请注意,您必须提供给 System.import 的模块名称可能会因您的设置而异。

TypeScript类被转换为ES5函数,因此您可以用这种方式在javascript中使用它们。

example.ts:

export class Example {
  constructor(public someValue: string, private someOtherValue: number) {

  }

  public method() {
    return this.someOtherValue;
  }
}

在脚本标签中这样:

  System.import('example.js').then(function(example) {
    // Example class is a function on the module 
    // use new to make a new instance
    var value = new example.Example('a', 5);

    // work as usual 
    console.log(value.method());

  }, console.error.bind(console));