let variable in angular ngif with multiple conditions

Question

In Angular (13) is there a way to assign the result of a function to a variable (in the .html part of a component, not template) having multiple conditions in ngIf

<div *ngIf="let getMyVar() as myVar && isVisible && isClean">
    {{ 'this is myVar: ' + myVar }}
</div>

if not what workaround is possible to implement?

Answer 1

The conditionals seem to use standard Javascript operator logic:

Mozilla documentation for the Logical AND operator states the following:

...the operator returns the value of the first falsy operand encountered when evaluating from left to right, or the value of the last operand if they are all truthy.

As such, the following works:

<div *ngIf="isVisible && isClean && getMyVar(); let myVar">
    {{ 'this is myVar: ' + myVar }}
</div>

I tested this locally, and it was successful at displaying the value of getMyVar()

Answer 2

did not find anything better than splitting the ngIf in two

<ng-container *ngIf="getMyVar(); let myVar">
    <div *ngIf="isVisible && isClean">
        {{ 'this is myVar: ' + myVar }}
    </div>
</ng-container>