Signals with null-assertion

Question

In a template, lets say we have something like:

@if (someSignal()?.someProperty!.trim().length > 0) {...}

someSignal is not required. not-null assertion on someProperty causes everything after this statement to block (not only the part within the @if block.

There are ways to circumvent that, I am just curious if this is expected behavior?

Answer 1

Instead of !. try using TypeScript safe access ?. which will perform a sort of null check on each field and will render only when the condition is true.

If there is a possibility of a value being undefined, you should prefer ?. instead of !. since it won't error out if the value is undefined.

Due to some template error, the other content fails to render is my guess.

@if (someSignal()?.someProperty?.trim()?.length > 0) {...}