Harsha Mullangi
Harsha Mullangi

Reputation: 564

Custom pipe not converting string into Dom Element

I created a custom pipe in angular 6 to convert string into HTMLDom Element(tag), I can able to get the response in my ts file but in html it is showing as [object Element]

{{link.portfolioCompanyLinkName.svGicons | quillConvertToDom }} 

My custom pipe Ts file

export class QuillConvertToDomPipe implements PipeTransform {

  transform(value: any, ...args: any[]): any {
    var xmlString = value;
    var doc = new DOMParser().parseFromString(xmlString, "text/xml"); 
    console.info(doc.firstChild);
    return doc.firstChild;
  }

}

when i console i am receiving the value

enter image description here

Upvotes: 1

Views: 349

Answers (2)

Nikhil
Nikhil

Reputation: 23

Try this

Replace var doc = new DOMParser().parseFromString(xmlString, "text/xml");

with below line var doc = new DOMParser().parseFromString(xmlString, "text/html");

Upvotes: 0

Adrita Sharma
Adrita Sharma

Reputation: 22203

You can use innerHtml instead of a pipe.

Try this:

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

Working Demo

Upvotes: 4

Related Questions