Why the HTMLDialogElement in Angular doesn't have showModal() method?

Viewed 242

When I am writing this, the MDN shows that HTMLDialogElement is supported in all browser except Internet Explorer. But weirdly enough, while using it, there is a warning which says it's not supported in most of the browsers and marks it depreceted. That was not the problem, until I found that calling showModal() is giving me error:

Property 'showModal' does not exist on type HTMLDialogElement

Am I missing something?

Here is my code:

let elem: HTMLDialogElement = document.getElementById("dlg") as HTMLDialogElement;
elem.showModal(); // this line gives error
1 Answers

According to the type definitions (lib.dom.d.ts) for HTMLDialogElement there is no method showModal(). You could cast elem to any to make the TypeScript Transpiler accept it:

(elem as any).showModal()

However, you should not use deprecated APIs. If you are using Material with Angular you could use the MatDialog service instead.

Related