CODEWITHSUNDEEP
angularrequirejs
user39558
user39558

Reputation: 141

Use Angular2 componets (TypeScript) in AngularJS application (plain old ES5)

I have troubles trying to use angular2 components in an an ES5 angularJS application with requireJS. When i use angular2.dev.sfx.js then i can use follwing code for bootstrapping:

define([
'nxApp',
'nxRoute',
 ], 
   function(nxApp, nxRoute){
     var upgradeAdapter = new ng.UpgradeAdapter();
     upgradeAdapter.bootstrap(document.body, ['nxApp']);
     return upgradeAdapter;
});

But then i cannot make use of import {Component} from 'angular2/angular2' in typescripts, because this translates to define(['angular2/angular2']... which in turn results in a script error as the script can not be loaded beacuse requireJS searches for angular2.js in the app root folder but it does not exist there.

When I use angular2.dev.js and system.js then the TypeScripts work but i cannot get a reference for angular 2 in my es5 bootsrapping code. ng ist not defined anymore an trying to place angular2/angular2 in the define throws me ann error that the common module has not been loaded.

Is it possible at all to use angular2 typescript components in a ES5 application?

Thanks.

Upvotes: 0

Views: 558

Answers (1)

user39558
user39558

Reputation: 141

I had to convert the ES5 Javascript part to make use of System.js. It has a similar configuration to RequireJs, the shims had to be replaces by meta.

With that i could load angular2.dev.js and system.js as it is shown in the angular 2 Quickstart. require('angular2/angular2') could then be used to get angular2 from within ES5 javascript.

Upvotes: 1

Related Questions