component inside iframe angular2

Question

Is there a way to include a component inside an iframe in Angular 2?

This code doesn't work (it should render the angular component called component-b inside the iframe):

  var doc = document.getElementById('iframe').contentWindow.document;
    doc.open();
    doc.write('<component-b></component-b>');
    doc.close();

This code works (it renders a simple button inside the iframe):

 var doc = document.getElementById('iframe').contentWindow.document;
    doc.open();
    doc.write('<button></button>');
    doc.close();

Angular doesn't process HTML added dynamically (no bindings or components/directives are instantiated) not outside an iframe nor inside. You could try `ViewContainerRef.createComponent()` like shown in http://stackoverflow.com/questions/36325212/angular-2-dynamic-tabs-with-user-click-chosen-components/36325468#36325468 — Günter Zöchbauer, Jul 18 '16 at 09:26

score 2 · Answer 1 · answered Jul 29 '16 at 10:18

if you have an iframe inside an angular2 app that means, it is a totally different context. (separate application)

because of the above, the component/binding cannot work there.

the only thing you can do, that you bootstrap another angular applucation inside your iframe, but im sure you do not want that.

1 Answers1