title: Google AdSense ads in Angular 2 components?
body: <p>I'm trying to load some Responsive ads in an <code>AdComponent</code> in my app. The component is dead simple:</p>
  
  <pre><code>import { Component } from '@angular/core';
  import { FORM_DIRECTIVES, CORE_DIRECTIVES } from '@angular/common';
  
  @Component({
    selector: 'ad',
    templateUrl: 'app/views/ad.html',
    directives: [ FORM_DIRECTIVES, CORE_DIRECTIVES ]
  })
  export class AdComponent {}
  </code></pre>
  
  <p><code>ad.html</code>:</p>
  
  <pre><code>&lt;div class="demo-card-wide mdl-card mdl-shadow--2dp ad-card"&gt;
    &lt;div class="mdl-card__supporting-text"&gt;
      &lt;script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"&gt;&lt;/script&gt;
      &lt;ins class="adsbygoogle"
          style="display:block"
          data-ad-client="ca-pub-0123456789"
          data-ad-slot="0123456789"
          data-ad-format="rectangle, horizontal"&gt;&lt;/ins&gt;
      &lt;script&gt;
      (adsbygoogle = window.adsbygoogle || []).push({});
      &lt;/script&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I'm finding that these script tags don't make it into the UI and <a href="https://github.com/angular/angular/issues/4903" rel="noreferrer">this seems to be a purposeful decision</a>.</p>
  
  <p>I might be able to move around some of the code such as the js reference into the head of my index.html and the <code>window.adsbygoogle</code> part into the component constructor but I'm not sure if these kinds of modifications are allowed or if there's a better alternative to get these ads to work in Angular 2.</p>
  
  <p>Does anybody have any experience with Google's Adsense ads working in Angular 2? Is there a different, proper way to do this?</p>