'In Angular, how to skip further ngIf check if a variable is null, in template

I have this in the template:

<div class="icon-action"
          *ngIf="node == null ? false : node.data && node.data.name && !node.parent.data.virtual"
          (click)="delete(node)">
          <img src="./assets/img/cross.png">
</div>

but even if node is properly checked, I still sometimes get the error:

TypeError: Cannot read properties of null (reading 'data')

Shouldn't the false just be returned? Somehow, angular proceeds to check for the value node.data, and I don't want it to, because it throws an error if it does. I tried many ways of checking for null, but none worked. I tried

*ngIf = "node && node.data && node.data.name && !node.parent.data.virtual)"

and

*ngIf = "node == null ? false : node.data && node.data.name && !node.parent.data.virtual"

and

*ngIf = "node !=null && node.data && node.data.name && !node.parent.data.virtual"

every time I am getting the same error

TypeError: Cannot read properties of null (reading 'data')

How to resolve this?

angularnull


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source

Related Questions