Home > Mobile >  let variable in angular ngif with multiple conditions
let variable in angular ngif with multiple conditions

Time:06-08

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?

CodePudding user response:

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>

CodePudding user response:

Not that good but might be an idea.

<ng-template #template [ngTemplateOutlet]="template" let-myVar="key1" [ngTemplateOutletContext]="{ key1: getMyVar() }">
  <div *ngIf="myVar && isVisible && isClean">
    {{ 'this is myVar: '   myVar }}
  </div>
</ng-template>

CodePudding user response:

If getMyVar() is return a boolean it ganna work

.component.html

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

.component.ts

getMyVar(){
   //return boolean;
}
  • Related