angular - 如何使用外部js libs构造和导入angularjs2 + typescript app？ - Thinbug

如何使用外部js libs构造和导入angularjs2 + typescript app？

时间：2015-10-28 09:52:55

标签： angular typescript systemjs

我的选择：

我是angularjs2的新手，但已经在angularjs1中完成了一个项目。我也是打字稿的新手。我已经遵循了typescript和angularjs2教程。我从未使用过systemjs或requirejs。

我想使用angularjs2和typescript与一些外部库（如fullcalendar和soundmanager2）构建一个Web应用程序（最好是一页）。我也喜欢用jade和sass作为我的视图和造型引擎/ whatev。 我想将其用作在浏览器中打开的简单html

假设我为我的“通用动态模块加载器”选择了systemjs。

我的代码：

<html>
  <head>
    <title>Angular 2 QuickStart</title>
    <script src="https://code.angularjs.org/tools/system.js"></script>
    <script src="https://code.angularjs.org/tools/typescript.js"></script>
    <script src="https://code.angularjs.org/2.0.0-alpha.44/angular2.dev.js"></script>
    <script>
      System.config({
        transpiler: 'typescript',
        typescriptOptions: { emitDecoratorMetadata: true }
      });
      System.import('./app.ts');
    </script>
  </head>
  <body>
    <my-app>loading...</my-app>
  </body>
</html>

import {bootstrap, Component, FORM_DIRECTIVES, CORE_DIRECTIVES} from 'angular2/angular2';

@Component({
    selector: 'my-app',
    template: `
      <h1>{{title}}</h1>
      <h2>My Heroes</h2>
      `,
      directives: [CORE_DIRECTIVES, FORM_DIRECTIVES]
})

class AppComponent {
  public title = "Tour of Heroes";
}

bootstrap(AppComponent);

我的问题：

上面的代码来自angularjs2教程。

最大的问题：如何将我的js库与我的typescript angularjs2代码结合起来？我是否可以编译打字稿或通过systemjs导入？如何获得角度来识别这些库及其appis？
如果我还使用脚本标签进行导入，为什么还要使用Systemj？
我是否将head作为已编译的css添加到head via或者我是否在@Component中添加已编译的css？
我的玉器怎么办？我是否也编译它们（我更想知道我的部分视图）或者我是通过角度添加它们（角度是否有玉支持？）

我理解angularjs是意见所以我想一切都有它在角度代码中的位置但是上帝我很难组织这个。

0 个答案:

没有答案