title: Using Angular2 from a script inside an iframe of the main document
body: <p>Note: I am new to Angular, any version.</p>
  
  <p>I am trying to add some Angular2 parts to the web UI that is otherwise implemented using other frameworks. In the scenario I have (and cannot get away from) the main document does not have (much) JavaScript running in it at all - all scripts are inside iframe element(s) inside that document, as managed by the main framework. </p>
  
  <p>I didn't even try to load Angular2 in that iframe, assuming that would not work. When it is needed (rarely), I "eval" all required Angular scripts on the main/root window to introduce Angular to it (once), but I have to have the JavaScript code configuring it inside the iframe, at least a bit of it and, because of that, it would be simpler for me to put all of it there. Inside that iframe I declared "ng" to be the "ng" from the main window. That enabled me to run the Angular2 5 minute quick start and worked fine. However, when I started adding more content via directives (I followed <a href="http://www.gurustop.net/blog/2015/12/16/angular2-beta-javascript-component" rel="nofollow">http://www.gurustop.net/blog/2015/12/16/angular2-beta-javascript-component</a>) this didn't work. Specifically, it threw exceptions from this Angular2 function:</p>
  
  <p>TypeScript:</p>
  
  <pre><code>function isValidType(value: Type): boolean {
    return isPresent(value) &amp;&amp; (value instanceof Type);
  }
  </code></pre>
  
  <p>Actual JavaScript:</p>
  
  <pre><code>function isValidType(value) {
      return lang_1.isPresent(value) &amp;&amp; (value instanceof lang_1.Type);
  }
  </code></pre>
  
  <p>Essentially it is was missing lang_1. The exception message has complaining of about "class0" and "class1".</p>
  
  <p>If I move the exact same code from the iframe to the main window, it works. Also, If I hack the Angular2's isValidType() function to simply return true as follows it also works:</p>
  
  <pre><code>function isValidType(value) {
      return true;
  }
  </code></pre>
  
  <p>I tried bringing lang_1 in from the main window to the iframe as well, but that did not help.</p>
  
  <p>Can someone, at least, tell me what is going on here, if not how to solve this? Thanks!</p>