如何导入 angular 升级适配器以获得混合应用程序？

Question

我看了官方的升级指南，一些博客like this，但我不明白。我想看看 angular2 的升级模块，但是当我尝试 bootstrap 使用 angular 升级适配器启动我的 ng1 应用程序时，一开始就失败了。

I get those errors

我的index.html

<html>
<head>
   (...)
   <script src="node_modules/angular/angular.js"></script>

   <script src="node_modules/es6-shim/es6-shim.min.js"></script>
   <script src="node_modules/systemjs/dist/system-polyfills.js"></script>
   <script src="node_modules/angular2/es6/dev/src/testing/shims_for_IE.js"></script>
   <script src="node_modules/angular2/bundles/angular2-polyfills.js"></script>
   <script src="node_modules/systemjs/dist/system.src.js"></script>
   <script src="node_modules/rxjs/bundles/Rx.js"></script>
   <script src="node_modules/angular2/bundles/angular2.dev.js"></script>
</head>
<body>
    <div ng-controller="AppController">
        (...)
    </div>

<script src="app/app.module.js"></script>
<script src="app/app.controller.js"></script>

<script>
    System.import('app/main')
            .then(null, console.error.bind(console));
</script>
</body>
</html>

main.ts（来自官方升级指南）

import {UpgradeAdapter} from 'angular2/upgrade';

const upgradeAdapter = new UpgradeAdapter();
upgradeAdapter.bootstrap(document.body, ['app'], {strictDi: true});

这样bootstrap就好了

angular.bootstrap(document.body, ['app'], {strictDi: true});

如果我只是想念某种 polyfill，这里是我的 package.json:

{
 (...)
  "dependencies": {
    "angular": "^1.4.9",
    "angular2": "^2.0.0-beta.14",
    "es6-shim": "^0.35.0",
    "jquery": "^2.2.3",
    "reflect-metadata": "^0.1.2",
    "rxjs": "^5.0.0-beta.2",
    "systemjs": "^0.19.26",
    "zone.js": "^0.6.6"
  },
  "devDependencies": {
    "concurrently": "^2.0.0",
    "lite-server": "^2.2.0",
    "typescript": "^1.8.9",
    "typings": "^0.7.12"
  }
}

我正在使用官方 5 分钟快速入门中的 tsconfig.json 和 typings.json。

无论我在哪里读到，这似乎都是一项微不足道的任务，但尽管我尝试了不同的方法 none 对我有用。那我错过了什么？

编辑：

解决方案如下蒂埃里所述导入

    <script src="node_modules/angular2/bundles/upgrade.dev.js"></script

您可以在 his answer here 中找到更多详细信息，它关注的是同一问题（实际上我之前已经阅读过但错过了对我来说重要部分的评论）。

Answer 1

您还需要包含 upgrade js 文件：

 <script src="node_modules/angular2/bundles/angular2-polyfills.js"></script>
 <script src="node_modules/systemjs/dist/system.src.js"></script>
 <script src="node_modules/rxjs/bundles/Rx.js"></script>
 <script src="node_modules/angular2/bundles/angular2.dev.js"></script>    
 <script src="node_modules/angular2/bundles/upgrade.dev.js"></script>

有关详细信息，请参阅此插件：

http://plnkr.co/edit/yMjghOFhFWuY8G1fVIEg?p=preview

如何导入 angular 升级适配器以获得混合应用程序？

How to import the angular upgrade adapter to get a hybrid application?

angularjs

systemjs

ng-upgrade

angular