Hi Sander / Angular Team,
Good Morning.
I have written a TypeScript:
import { Component, OnInit, ElementRef, OnDestroy, ViewChild } from
'@angular/core';
// import { SearchResult } from './search-result.model';
import { HttpClient } from '@angular/common/http';
// import { map } from 'rxjs/operators';
// import 'rxjs/add/operator/map';
// import 'rxjs/add/operator/catch';
// import 'rxjs/Rx';
@Component({
selector: 'app-web-app',
templateUrl: './web-app.component.html',
styleUrls: ['./web-app.component.css']
})
export class WebAppComponent {
// results: SearchResult[];
htmlResponse: any;
@ViewChild('mapElement') public mapElement: ElementRef;
constructor(private http:HttpClient) {
}
getHtmlFromService() {
const url = 'XXXX';
this.http.get(url, {responseType: 'blob'})
.subscribe((data => {
console.log(" The Data is", data);
this.createResponseFromBlob(data);
}));
}
createResponseFromBlob(htmlRes : Blob)
{
console.log('HTML Response is', htmlRes.size);
console.log('HTML Response is', htmlRes.type);
this.htmlResponse=htmlRes;
// this.mapElement.nativeElement.innerHTML= this.htmlRes;
console.log('Response is',this.htmlResponse);
this.mapElement= this.htmlResponse;
// this.mapElement.nativeElement= this.htmlResponse;
console.log('element is', this.mapElement);
}
//htmlTemplate = this.htmlResponse;
//htmlTemplate = this.mapElemen;
}
I have an HTML:
<div class='container'>
<div class="page-header">
<h1>Map Search
</h1>
<button type="button" (click)="getHtmlFromService()">Get Html</button>
</div>
<div [innerHTML]="mapElement"></div>
</div>
It is displaying the output as:
[image: image.png]
I am not able to get the HTML page instead it is displaying as [Object
Blob].
How to convert Object Blob as an HTML Page? Can You please help me with
this?.
Waiting for your response.
Thanks & Regards,
Suresh Kumar
--
You received this message because you are subscribed to the Google Groups
"Angular and AngularJS discussion" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
