如何在Angular 2中使用Async库?

时间:2016-05-11 13:14:07

标签: typescript angular systemjs

我尝试在Angular 2(2.0.0-rc.1)应用程序中导入Async库但没有成功。 https://github.com/caolan/async#es-modules

我收到以下错误:

zone.js:101 GET http://localhost:3003/traceur 404 (Not Found)
(index):31 Error: Error: XHR error (404 Not Found) loading http://localhost:3003/traceur(…)

这就是我的所作所为:

npm install async-es --save

在“systemjs.config.js”中:

(function (global) {

    // map tells the System loader where to look for things
    var map = {
        // ...
        'async-es': 'node_modules/async-es'
    };

    // packages tells the System loader how to load when no filename and/or no extension
    var packages = {
        // ...
        'async-es': { main: 'index.js', 'defaultExtension': 'js' }
    };

    // ...

    System.config(config);
})(this);

在“my.component.ts”中:

import {async} from 'async-es';

我尝试通过导入其他库来导入它。

感谢。

1 个答案:

答案 0 :(得分:1)

我认为您使用的Angular2版本有点旧(alpha)。你应该使用beta或rc。

以下是主HTML文件中的配置:

<script src="node_modules/zone.js/dist/zone.js"></script>
<script src="node_modules/reflect-metadata/Reflect.js"></script>
<script src="node_modules/systemjs/dist/system.src.js"></script>

<!-- 2. Configure SystemJS -->
<script src="systemjs.config.js"></script>
<script>
  System.import('app').catch(function(err){ console.error(err);  });
</script>

以及systemjs.config.js一个的内容:

var map = {
  'app': 'app', // 'dist',
  'rxjs': 'node_modules/rxjs',
  '@angular': 'node_modules/@angular'
};

var packages = {
  'app': { main: 'main.js',  defaultExtension: 'js' },
  'rxjs': { defaultExtension: 'js' },
};

var packageNames = [
  '@angular/common',
  '@angular/compiler',
  '@angular/core',
  '@angular/http',
  '@angular/platform-browser',
  '@angular/platform-browser-dynamic',
  '@angular/router',
  '@angular/router-deprecated',
  '@angular/testing',
  '@angular/upgrade',
];

packageNames.forEach(function(pkgName) {
  packages[pkgName] = { main: 'index.js', defaultExtension: 'js' };
});

var config = {
  map: map,
  packages: packages
}

if (global.filterSystemConfig) { global.filterSystemConfig(config); }

System.config(config);

有关详细信息,请参阅此链接: