Angular Ivy type check: Type 'SafeHtml' is not assignable to type 'string'

Viewed 3764

I am getting Typescript error after switching to Ivy compiler:

[Step 4/5] src/app/app.component.html(1,26): Type 'SafeHtml' is not assignable to type 'string'.

In Angular class there is a member property declared as SafeHtml:

@Component({
  selector: 'app',
  template: `<div [innerHTML]="description"></div>`
})
export class AppComponent {
  description: SafeHtml;

  constructor(private sanitizer: DomSanitizer) {}

  ngOnInit(): void {
    this.description = this.sanitizer.sanitize(SecurityContext.HTML, '<strong>whatever comes from server</strong>');
  }
}

My question is how to convert SafeHtml and SafeUrl to string? Is it just .toString() OK?

Angulars SafeHtml is declared as:

/**
 * Marker interface for a value that's safe to use as HTML.
 *
 * @publicApi
 */
export declare interface SafeHtml extends SafeValue {
}

And [innerHtml] defined in lib.dom.d.ts:

interface InnerHTML {
    innerHTML: string;
}

The innerHtml is type of string, whereas I have SafeHtml.

How to reproduce:

git clone https://github.com/felikf/angular-repro-safe-html.git
npm i
npm run build

enter image description here

1 Answers
Related