Angular2在每次鼠標移動時重新渲染

Question

我有一個Angular2（2.4.0）應用程序，它在ngFor循環中提供了一個列表，我注意到每次移動鼠標時都會重新渲染列表。有沒有人注意到類似的行爲和/或知道爲什麼它是這樣的？

<table class="responsive-table bordered highlight"> 
    <tbody> 
    <tr *ngFor="let person of getPersons()"> 
     <td>{{person.name}}</td> 
    </tr> 
    </tboby> 
</table> 

我在getPersons添加的console.log語句（）和它的越來越的每個鼠標移動記錄：

，這是獲得重新呈現表。

Answer 1

使用返回對象數組的方法是非常糟糕的解決方案。 你應該迭代靜態數組或使用管道（這取決於大小寫）。

試着打電話給你的函數構造（或ngOnInit方法），例如：

在您的打字稿文件：

@Component({ 
    selector: 'some-selector', 
    templateUrl: 'template.html' 
}) 
export class SomeComponent { 

    someArray: any[]; 

    ngOnInit() { 
     this.someArray = getPersons(); 
    } 

    getPersons() { 
     //some code... 
    } 
} 

，並在你的HTML文件（template.html ）：

<tr *ngFor="let obj of someArray"> 
... 
</tr>