Question

我想实现Angular 2＆＃39; security functionality，特别是CSRF，它使用XSRFStrategy提供程序。我使用的当前引导程序不足以实现此提供程序。

这带来了找到加载和初始化Angular 2的最佳（正确？）方式的挑战。我尝试了几种方法，唯一有效的方法现已弃用。

我已经采用了这种方法：

<script src="https://code.angularjs.org/2.0.0-beta.9/angular2-polyfills.min.js"></script>
<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-beta.9/angular2.dev.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.9/Rx.min.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.9/http.dev.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.9/router.dev.js"></script>
<script>
System.config({
    transpiler: "typescript",
    packages: {
        app: { main: 'app', defaultExtension: "ts" }
    }
});
System.import("app").then(null, console.error.bind(console));
</script>

我无法让这个工作（来自Angular 2＆＃39; 5 Min Quickstart演示）：

<script src="https://npmcdn.com/zone.js@0.6.12?main=browser"></script>
<script src="https://npmcdn.com/reflect-metadata@0.1.3"></script>
<script src="https://npmcdn.com/systemjs@0.19.27/dist/system.src.js"></script>
<script>
(function(global) {
    var map = {
        app:                          'app', // 'dist',
        '@angular':                   'https://npmcdn.com/@angular',
        '@angular/common':            'https://npmcdn.com/@angular/common@2.0.0-rc.4',
        'angular2-in-memory-web-api': 'https://npmcdn.com/angular2-in-memory-web-api',
        rxjs:                         'https://npmcdn.com/rxjs@5.0.0-beta.10'
    };

    var packages = {
        app:                          { main: 'app', defaultExtension: 'js' },
        rxjs:                         { defaultExtension: 'js' },
        'angular2-in-memory-web-api': { main: 'index', defaultExtension: 'js' }
    };
    var ngPackageNames = [
        'common',
        'compiler',
        'core',
        'http',
        'platform-browser',
        'platform-browser-dynamic',
        'router',
        'router-deprecated',
        'upgrade'
    ];
    // Individual files (~300 requests):
    function packIndex(pkgName) {
        packages['@angular/'+pkgName] = { main: 'index', defaultExtension: 'js' };
    }
    // Bundled (~40 requests):
    function packUmd(pkgName) {
        packages['@angular/'+pkgName] = { main: '/bundles/' + pkgName + '.umd', defaultExtension: 'js' };
    }
    var setPackageConfig = System.packageWithIndex ? packIndex : packUmd;
    ngPackageNames.forEach(setPackageConfig);
    var config = {
        map: map,
        packages: packages
    };
    System.config(config);
})(this);
</script>

也不是2016年6月16日stackoverflow中推荐的设置here（Plunkr）。这个是专门针对来自http的无效提供程序错误。

引导Angular 2的最佳方法是什么？

Answer 1

Here is the bootstrap process used by the angular team. 
They created this plunker to help contributors report issues.

http://plnkr.co/edit/tpl:AvJOMERrnz94ekVua0u5?p=preview

Answer 2

您要求最佳做法但使用在线CDN？这不是最好的做法。你应该按照5分钟快速启动，或者你可以从github下载有角度的2种子，有很多： https://github.com/angular/quickstart

https://github.com/angular/angular-cli

祝你好运

Answer 3

目前推荐引导/启动Angular 2项目的方法是使用 Angular CLI ，看看this精彩帖子！希望它有所帮助;）

Angular 2 - 当前（正确）引导过程是什么？

3 个答案: