var adapter = new ng.upgrade.UpgradeAdapter();
angular.module('angular-legacy',[]);
angular.module('angular-legacy').component('lzGreetings', {
template: '<div>lzGreetings</div>'
})
var Foo2 = ng.core
.Component({
selector: 'foo2',
template: '<lz-greetings></lz-greetings>Foo 2',
directives: [adapter.upgradeNg1Component('lzGreetings')]
})
.Class({
constructor: function () { }
});
var AppComponent = ng.core
.Component({
selector: 'app',
template: '<foo2></foo2>',
directives: [Foo2]
})
.Class({
constructor: function () { }
});
angular.module('angular-legacy').directive('app', new ng.upgrade.UpgradeAdapter().downgradeNg2Component(AppComponent));
adapter.bootstrap(document.body, ['angular-legacy']);
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>AngularJS Plunker</title>
<script>document.write('<base href="' + document.location + '" />');</script>
<link rel="stylesheet" href="style.css" />
<script data-require="angular.js@1.4.x" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.js" data-semver="1.5.5"></script>
<script src="https://code.angularjs.org/2.0.0-beta.15/angular2-polyfills.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.15/Rx.umd.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.15/angular2-all.umd.dev.js"></script>
</head>
<body>
<app></app>
</body>
<script src="app.js"></script>
</html>
/* Put your css in here */