javascript - Angular 6 mengonversi string menjadi HTML menggunakan pipe

String input saya adalah

  html:string="<a role="button" class=" fas fa-trash-alt fa-1x" title="Remove Link" href="#"></a>"

Saya ingin ini diubah menjadi HTML mentah

Pipa :

import { Pipe, PipeTransform } from '@angular/core';
import { DomSanitizer } from '@angular/platform-browser'
@Pipe({
  name: 'htmldecoder'
})
export class HtmldecoderPipe implements PipeTransform {
  constructor(private sanitized: DomSanitizer) { }
  transform(value) {
    return this.sanitized.bypassSecurityTrustHtml(value);
  }

}

Kode Html :

<div>
    <div [innerHtml]="html | htmldecoder">
    </div>
</div>

Output yang muncul di UI adalah

<a role="button" class="fas fa-trash-alt fa-1x" title="Remove Link" href="#"></a>

Output yang Diharapkan Harus berupa Tombol

Jawaban #1

Lakukan perubahan berikut pada kode Anda dan itu akan bekerja, kodenya cukup sederhana untuk pemahaman sendiri

app.component.ts

  html = `html:string="<a role="button" class=" fas fa-trash-alt fa-1x" title="Remove Link" href="#">aditya</a>"`;

pipa

  transform(value) {
    value = value.substring(13, value.length-1);
     var doc = new DOMParser().parseFromString(value, "text/html");
     const value123 = doc.documentElement.textContent;
    return this.sanitized.bypassSecurityTrustHtml(value123);
  }

app.component.html

<div [innerHTML]="html | htmldecoder">