自定义管道未将字符串转换为Dom元素

Question

我在angular 6中创建了一个自定义管道，将字符串转换为HTMLDom Element（tag），我可以在ts文件中获取响应，但是在html中，它显示为[object Element]

{{link.portfolioCompanyLinkName.svGicons | quillConvertToDom }} 

我的自定义管道Ts文件

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;
  }

}

当我控制台时，我会收到值

Answer 1

您可以使用innerHtml代替管道。

尝试一下：

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

Working Demo

Answer 2

尝试一下

替换 var doc = new DOMParser（）。parseFromString（xmlString，“ text / xml”）;

下面一行 var doc = new DOMParser（）。parseFromString（xmlString，“ text / html”）;