javascript - การเพิ่มแท็ก html ภายในไฟล์ typescript ใน angular

ฉันกำลังใช้ Angular2 ดังนั้นฉันจึงต้องการใช้งานแท็ก HTML ภายในฟังก์ชัน return ในไฟล์ ts

  tooltip: (param: any) => {
        return `<span> ${param.value} </span>`;
      }

ฉันได้พยายามใช้ template literal แต่สิ่งนั้นทำให้ span ของฉันมองเห็นได้

มีใครพอจะมีไอเดียไหมว่าฉันจะใช้ span ให้ถูกวิธีได้อย่างไร

คำตอบ #1

ลองใช้โค้ดตัวอย่าง Stackblitz นี้

import {Component, NgModule, Pipe, PipeTransform} from '@angular/core'
import {BrowserModule} from '@angular/platform-browser'
import { FormsModule } from '@angular/forms';

import { DomSanitizer } from '@angular/platform-browser'

@Pipe({ name: 'safeHtml'})
export class SafeHtmlPipe implements PipeTransform  {
  constructor(private sanitized: DomSanitizer) {}
  transform(value) {
    console.log(this.sanitized.bypassSecurityTrustHtml(value))
    return this.sanitized.bypassSecurityTrustHtml(value);
  }
}

@Component({
  selector: 'my-app',
  template: `<div [innerHtml]="tooltip('Hello World') | safeHtml">
    </div>`,
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  name = 'Angular';
  tooltip(param: any) {
        return `<span> ${param} </span>`;
      }
}