使用Angular2项目中的AngularJS（Angular1）模块

刚刚开始了一个演示Angular2项目（之前没有Angular1/AngularJS的经验。我已经从在线快速入门和教程中学习和扩展了，一切都很好。但是我现在想使用为AngularJS设计的库中的一些组件，并且没有任何问题

关于AngularJS/Angular2兼容性的大部分可用信息都假设您有一个正在添加Angular2组件的AngularJS项目，而不是相反，因此我希望做的事情可能根本不可能。到目前为止，我尝试了一个基于Angular2 quickstart的简单精简项目，带有一个le Angular2组件，加载到index.html中。然后我想将现有库（基于AngularJS）中的组件集成到这个库中

• 我尝试使用

  UpgradeAdapter.upgradeNg1Component

  从库中创建组件，并将它们直接添加到Angular2组件中

• 我曾尝试通过npm安装angularjs，将它导入脚本标记到我的

  index.html

  中，然后使用

  UpgradeAdapter.Degradeng2Component

  和

  UpgradeAdapter.bootstrap

  组合来加载我的Angular2作为降级模块

这两个似乎都不起作用-组件无法显示，浏览器控制台告诉我有一个

uncaughtsyntaxerror:Unexpected标记<
评价http://localhost:3000/angular2/upgrade
加载错误http://localhost:3000/app/main.js

---

目前我最好的猜测是，这实际上是一个不受支持的场景，我需要一个“合适的”AngularJS应用程序，以便使用Angular2的

UpgradeAdapter

功能。有人能证实这一点吗？或者我在这里遗漏了什么愚蠢的东西吗？

下面是一个正在使用的plunkr，描述如何混合Angular1和Angular2要素：

重要的一点是在

UpgradeAdapter

上启动

main组件。这样，所有元素都可以在提供者（服务/工厂）和指令（组件/指令）中使用：

这两个答案可以帮助您：




因此，本例中的主要问题是，升级组件似乎没有作为基本angular 2捆绑包的一部分包括在内。添加后：


在我的index.html文件中，我看到的错误消失了

感谢答案为我指明了正确的方向！
@Bryan感谢这一点-我的理解是，对于AngularJS/Angular2混合应用程序，您不能使用
ng应用程序
标签，而必须使用
bootstrap（）
？直接链接到node\u modules文件夹是一个糟糕的解决方案。部署解决方案后，该文件夹不再存在（假设您使用某种捆绑设置）
upgrade.bootstrap(document.body, ['heroApp']);