Embed HTML file into Angular div

Question

I am trying to embed a Hosted HTML page in my angular app. However the div is coming back blank. I followed this article and modified the code for angular 7 to no avail Angular4 Load external html page in a div

I console log out the result but it shows empty

My code is a as follows

  template: any = '';
  constructor(http: HttpClient) {
      http.get('http://www.google.com').map((html: any) => this.template = html);
      console.log(this.template);
  }


  <div [innerHtml]="template"></div>

Sachila Ranawaka · Accepted Answer · 2018-12-03 15:37:54Z

1

You need to subscribe to the observable in order to receive the data.

http.get('http://www.google.com').subscribe((html: any) => {
   this.template = html
   console.log(this.template);
});

answered Dec 3, 2018 at 15:37

Sachila Ranawaka

41.6k8 gold badges62 silver badges87 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

enf0rcer Over a year ago

I believe that is done automatically when using map. Probably he needs to change his syntax to use pipeable operators.

Sachila Ranawaka Over a year ago

In order to fire up the observable (including map), we need to use the subscribe method

Sachila Ranawaka Over a year ago

@enf0rcer I add the content inside the susbcribe function since i don't see why we need map operator in here. But if he is using it then, yes we need to use the pipeable operator

RRB Over a year ago

I get an error error: SyntaxError: Unexpected token < in JSON at position 0 at JSON.parse and message "Http failure during parsing for google.com"

enf0rcer Over a year ago

@SachilaRanawaka you are right it makes no sense in this context

|

Collectives™ on Stack Overflow

Embed HTML file into Angular div

1 Answer 1

8 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

8 Comments

Linked

Related