title: how to render html response in angular 6 from a different domain
body: <p>I am trying to Integrate AEM forms with Angular. I have my AEM forms url which will send the data in HTML and that HTML I have to render into Angular.</p>
  
  <p>I am facing two issues :</p>
  
  <ol>
  <li><p>The AEM site is hosted in different domain. So for that I added the header to stop cross domain issue and as the response I am getting is in html I have to set the response type as HTML. BY doing so the angular is able to render the HTML correctly but the the css and js are not loading properly as the response HTML has the the relative path of css and js.</p></li>
  <li><p>As aforesaid I am using two extra parameter by build is failing by saying that only 1-2 parameter is expected in get.</p></li>
  </ol>
  
  <p><strong>TS FILE</strong></p>
  
  <pre class="lang-ts prettyprint-override"><code>@Component({
    selector: 'app-embeddedforms',
    templateUrl: './embeddedforms.component.html',
    styleUrls: ['./embeddedforms.component.css']
  })
  export class EmbeddedformsComponent implements OnInit {
  
    constructor(private http: HttpClient) {}
    private url = 'http://localhost:4505/content/forms/af/formspoc/baggage-calculator.html';
    ngOnInit() {
      this.http.get(this.url, {
        responseType: 'html'
      }, {
        headers: {
          'Access-Control-Allow-Methods': 'GET',
          'Access-Control-Allow-Origin': '*'
        }
      }).subscribe(data =&gt; {
        document.getElementById('formdata').innerHTML = data;
      });
    }
  }
  </code></pre>
  
  <p><strong>html CODE</strong> </p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;ul&gt;embedded forms Start Here
      &lt;li&gt;Here we are trying to embedded the forms with angular &lt;/li&gt;
  &lt;/ul&gt;
  
  &lt;div id="formdata"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>The expected result is that angular site should be able to embed the aem form with all it's css, js and functionality but this is not happening.</p>