This is normal as every time the change-detection cycle is called it will evaluate the template and your function is part of it, so the function will be re-evaluated(called again).
A brief explanation of how does the change detection work in Angular
Imagine that each time there is an event, that might cause any change (for example clicks, some time intervals are doing something, ajax calls) Angular takes the template and re-evaluates it for you out of the box (in other words updates the HTML).
When you use the onPush
strategy you are basically telling angular to stop listening for any of the mentioned changes because you will be the one in charge of telling the framework when a change has occurred.
** Disclaimer we have the | async
that can be used in templates and it will work fine with the onPush
strategy and if your inputs change by reference change detection will be triggered, but as I said this is a brief explanation.
So the thing that you can do is (i assume that you are getting the ids from the check$
observable)
myCheck$ = this.check$.pipe(map(arrayOfIds => arrayOfIds.includes(style.component)))
and then use myCheck$
inside your template with |async
.
If this doesn't work please explain in more detail your use case.
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…