In the past, I frequently used Angular's *ngIf directive in my HTML pages:
<p *ngIf="var === true">Test</p>
(for instance)
However, there have been instances where I needed to perform multiple checks within the *ngIf directive on certain pages, sometimes even across multiple tags on the same page:
<p *ngIf="var1 === true && var2 === true && var3 === true && var4 === true && var5 === true && var6 === true && var7 === true && var8 = == true && var9 === true && var10 === true">Test</p>
(for example)
To simplify this complex condition, I decided to refactor it as follows:
<p *ngIf="this.isVarsTrue()">Test</p>
And in my TypeScript file:
isVarsTrue () {
if (var1 === true && var2 === true && var3 === true && var4 === true && var5 === true && var6 === true && var7 === true && var8 === true && var9 === true && var10 === true) {
return true;
} else {
return false;
}
}
Upon further inspection by adding a console log to this method, I noticed that it is being called multiple times (5 times for each action on the page). This made me question whether this approach is considered good practice or not.
I appreciate any insights you may have on this matter. Thank you!