我正在学习Angular变化检测过程并检查Chrome中的开发工具,我看到了奇怪的行为.
我的plnkr演示了这种行为:http://plnkr.co/edit/cTLF00nQdhVmkHYc8IOu
我有一个简单的组件与视图:
<li *ngFor="let item of list">{{item.name}}</li>
Run Code Online (Sandbox Code Playgroud)
和构造函数:
constructor() {
this.list = [{name: 'Gustavo'}, {name: 'Costa'}]
Run Code Online (Sandbox Code Playgroud)
模拟我添加的简单请求:
// simulating request repaint the DOM
setInterval( () => {
this.list = [{name: 'Gustavo'}, {name: 'Costa'}];
}, 2000);
Run Code Online (Sandbox Code Playgroud)
如果您注意到,数组list会收到一个等于初始值的列表.让我们假设当Angular在变更检测过程中检查视图中的值时,我们有这样的代码:
if( oldName !== name ) { // ( 'Gustavo' !== 'Gustavo')
// update the view
}
Run Code Online (Sandbox Code Playgroud)
但是值是相同的,为什么角度每2秒重复一次DOM.?

但如果我改变对象,则不会发生REPAINT
// simulating request there is not repaint
setInterval( () => {
this.list[0].name = "Gustavo"; // no repaint because it's …Run Code Online (Sandbox Code Playgroud)