I try to load html with innerHTML but it does not work.

page.ts

htmlStr = `<div [ngClass]="getClass('COLECTOR')">HELLO WORLD</div>`;

page.html

<div [class]="getClass('COLECTOR')"> </div>

When I inspect code in Chrome:

-If i use [innerHtml] the method doesn't work. See the method as string:

<div [ngclass]="getClass('COLECTOR')">HELLO WORLD</div>

-If I don't use the pipe i only see:

<div>HELLO WORLD</div>

But.............

If i put the div tag in the page.thml without load the html from the string with innerHTML it works

<div [ngClass]="getClass('COLECTOR')">HELLO WORLD</div>

when inspect the code i see:

<div class="manual">HELLO WORLD</div>

This last is what i want to get but loading the HTML from a string.

pipe

@Pipe({
  name: "domSanitizer",
})
export class DomSanitizerPipe implements PipeTransform {
  constructor(private sanitizer: DomSanitizer) {}

  transform(value: string, type: string): SafeHtml | SafeStyle | SafeScript | SafeUrl | SafeResourceUrl {
        switch (type) {
            case 'html':
                return this.sanitizer.bypassSecurityTrustHtml(value);
...