在Angular 2中,可以使用ChangeDetectorRef
类来手动触发变更检测。下面是一个示例代码,演示如何将数据推送到数组中并更新视图。
首先,在组件的构造函数中注入ChangeDetectorRef
:
import { Component, ChangeDetectorRef } from '@angular/core';
@Component({
selector: 'app-example',
template: `
- {{ item }}
`
})
export class ExampleComponent {
items: string[] = [];
constructor(private cdr: ChangeDetectorRef) {}
addItem() {
this.items.push('New Item');
// 手动触发变更检测
this.cdr.detectChanges();
}
}
在上面的示例中,addItem()
方法将一个新项添加到数组items
中,并在操作完成后手动触发变更检测,以更新视图。
注意,ChangeDetectorRef
类的detectChanges()
方法会触发组件及其子组件的变更检测。如果只想更新当前组件的视图而不涉及子组件,可以使用markForCheck()
方法。
此外,还可以使用NgZone
类来管理变更检测,它提供了更高级的功能。但是,在大多数情况下,使用ChangeDetectorRef
就足够了。