angular ngif函数为什么会渲染很多次

Question

<tr *ngFor="let data of datas;let i = index" [class.checked]="getTrChecked(data)">

表格是表头固定，内容滚动的，滚动过程中getTrChecked这个函数一直在执行，导致滚动卡顿，为什么会出现这种情况，如何优化

Answer 1

Angular会不断检测[]后面的表达式的值是否变化，所以getTrChecked会不断执行，这是angular的变化检测机制，angular不知道getTrChecked返回值什么时候会变化，所以每个鼠标移动，每次http请求，每次界面上的dom事件之后，angular都要重新检查getTrChecked返回值是否变化。

如果你一定要这样写，就要把getTrChecked写得最高效率，能够经得起每秒几百次调用。

要么，你自己知道getTrChecked返回值什么时候会变化的话，可以自己调用getTrChecked，把返回值放在一个component的属性中，然后 [class.checked]=这个属性，然后你在适当的时机调用getTrChecked更新属性。

Answer 2

表格内容多可以使用虚拟滚动功能，大大提高性能