Informing Typescript that a Value Will Be Initialized

Scenario

Our has the following code:

@query('#gist')
gist: HTMLIFrameElement;

And Typescript linting produces this error:

Property ‘gist’ has no initializer and is not definitely assigned in the constructor.

We want to clear this error.

Approach

Add an exclamation point (! — formally the Typescript non null assertion operator) after the property name like this:

@query('#gist')
gist!: HTMLIFrameElement|null;

This tells Typescript that the value will be initialized.

Related Concepts