I am facing an issue with passing HTML content from a service to a div element. I have a function that fetches HTML content as a string from a file and converts it into an HTML object, which I can see working in the console. However, when trying to assign this HTML object to a variable in my service, I encounter an error.
nav.service.ts:
html: string;
public getZipFileContent(urlPath:string, pathInZip:string) {
getFileContentFromRemoteZip(urlPath, pathInZip, (content) => {
console.log(content);
let html = content;
let htmlObject = document.createElement('div');
htmlObject.innerHTML = html;
console.log(htmlObject);
this.html = html; // it's a string
this.html = htmlObject // error : can't assign string as HTMLDivElement
});
}
}
In my component, by adding {{navSrv.html}}, currently I get:
https://i.sstatic.net/MAo5M.png
However, I would like to display:
Hello
Based on the console log from console.log(htmlObject);
https://i.sstatic.net/NF1NW.png
How can I retrieve the htmlObject and use it as a variable?