3

I want to know if it is possible to make an angular2 app self contained and be used in any existing angular or non angular site. Basically treat my app as an SDK or Framework.

I am not developing as a Module to be included in a existing Angular App. I want to download a package (my app), reference it using a <script> or require and be able to do something like this in the existing sites markup.

//SiteSelectorID is id of the target dom element in the existing site packagedApp.init('SiteSelectorID'))

which would do something like this

//Add the Angular2 entry point selector to the inner html of the SiteSelectorID 
document.getElementById(selector).innerHTML = <packagedApp></packagedApp>

//Start my Angular2 app to run and not conflict with any parent of my entry selector
System.import('app').catch(function(err){ console.error(err); });

My app contains its own partial views, css files, api's and needs to only have scope of itself.

Is this possible?

Mr Lister
  • 45,515
  • 15
  • 108
  • 150
Rob
  • 11,185
  • 10
  • 36
  • 54
  • Should be possible. Isn't that how plunker and similar sites work, in principal? Not sure about the details tho' (: – Sasxa Oct 11 '16 at 18:15
  • So the best I could come up with so far is using an `iFrame`, and then you can use `window.frames[0].frameElement.contentWindow.MyAngularAppMethod()` to access exposed methods. This allows you to give commands programmatically to your angular app and encapsulate its own scope and features. I did try using `xmlHttpRequest` to load it in but I could not get the scripts to read correctly to instantiate the app. I am open to other(better) ways of doing this. – Rob Oct 11 '16 at 21:15

0 Answers0