Use AngularJS (Angular1) module from Angular2 project

Question

Just started a demo Angular2 project (no previous experience with Angular1/AngularJS. Have followed and extended from the online quickstart and tutorials, and all was fine. Howe

Answer 1

So the major problem in this case turned out to be the fact that it appears that the upgrade components aren't included as part of the basic angular 2 bundle. After adding:

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

to my index.html file the error I was seeing disappeared.

Thanks to the answer here for pointing me in the right direction!

Answer 2

Here is a working plunkr describing how to mix Angular1 and Angular2 elements:

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

An important point is to bootstrap your main component on the UpgradeAdapter. This way all elements are available in providers (services / factories) and in directives (components / directives):

upgrade.bootstrap(document.body, ['heroApp']);

These two answers could help you:

• angular 1.x and angular2 together
• How to inject upgraded Angular 1 service/factory to Angular 2 component in ES5?