Call a finction and get return value directly in html better or set return value in a variable and use this variable in html better?

Viewed 37

I have a question about Call a finction and get return value directly in html better or set return value in a variable and use this variable in html better?

in the html

<div ngIf=isValid()>

</div>

in ts file:

public isValid(): boolean {


}

is this way better or

<div ngIf=isValid>

</div>

in ts file:


public isValid = false;
public isValidValue(): void {

if(){
 isValid = true;
}

}

which way ist better?

1 Answers

Here is a nice article on this. Though it is not official this guys points are legit.

https://medium.com/showpad-engineering/why-you-should-never-use-function-calls-in-angular-template-expressions-e1a50f9c0496

Main point to be taken from this article are

  • Function calls are called multiple times on angular change detection cycles(this can be many times).
  • In some case your simple methods might get modified by another developer afterwards(or by your self)

Still the point is (small operation * number of times) = might become heavy

This might is not acceptable when it is purely avoidable using other methods such as pure pipes or manual calculations to variables

He even has nice stackblitz setup for compare

Related