Display a DXF file in angular

I am uploading a file of type dxf in my angular application and getting the text format of it. Later it is parsed using dxf-paser and it returns array of entities. Now I need to display this parsed dxf file in my angular application inside a div. how do I do it.

I have added a div in html file and trying to append the dxf parsed entities into it but it displays nothing. Can someone please help me figure out the issue here

in Ts:

on file upload

const file =$event.target.files[0];
this.fileText = await file.text();

convertToDxf() {
var parser = new DxfParser();
try{
var dxf = parser.parseSync(this.fileText);
console.log(dxf);
this.isdxfConverted = true;
const div = document.createElement("div");
if(dxf !== null) {
div.innerHTML = dxf.toString();
}
div.style.height = '500px';
div.style.width = '100%';
let container = document.getElementById('dxfDisplay');
container?.append(div);
}
catch {

}


in HTML

<div *ngIf="isdxfConverted" style="min-height: 500px" id="dxfDisplay">

</div>

Continue reading...