在Angular中,当对象的值发生变化时,如果没有通过变更检测进行注册,界面上的数据将不会更新。以下是一种解决方法,使用ChangeDetectorRef手动触发变更检测:
ChangeDetectorRef模块:import { Component, ChangeDetectorRef } from '@angular/core';
ChangeDetectorRef:constructor(private cdr: ChangeDetectorRef) { }
detectChanges()方法:this.cdr.detectChanges();
下面是一个完整的示例代码:
import { Component, ChangeDetectorRef } from '@angular/core';
@Component({
selector: 'app-example',
template: `
{{ data.name }}
`
})
export class ExampleComponent {
data = { name: 'John' };
constructor(private cdr: ChangeDetectorRef) { }
changeData() {
this.data.name = 'Jane';
this.cdr.detectChanges();
}
}
在上面的示例中,当点击"Change Data"按钮时,data对象的name属性会发生变化,并通过手动调用detectChanges()方法触发变更检测,从而更新界面上的数据显示。