触发Angular2手动更改检测
我正在编写一个具有Mode(): string
属性的Angular 2组件。 我希望能够以编程方式设置此属性不响应任何事件。 问题是,如果没有浏览器事件,模板绑定{{Mode}}
不会更新。 有没有办法手动触发这个变化检测?
尝试其中之一:
-
ApplicationRef.tick()
– 类似于Angular 1的$rootScope.$digest()
– 即检查完整的组件树 -
NgZone.run(callback)
– 类似于$rootScope.$apply(callback)
– 即评估Angular 2区域内的callback函数。 我想,但我不确定,这最终会在执行callback函数后检查完整的组件树。 -
ChangeDetectorRef.detectChanges()
– 类似于$scope.$digest()
– 即只检查这个组件及其子组件
您可以将ApplicationRef
, NgZone
或NgZone
注入到组件中。
我使用了接受的答案参考,并希望举一个例子,因为Angular 2的文档非常难以阅读,所以我希望这很容易:
-
导入
NgZone
:import { Component, NgZone } from '@angular/core';
-
将它添加到你的类的构造函数
constructor(public zone: NgZone, ...args){}
-
用
zone.run
运行代码:this.zone.run(() => this.donations = donations)
我能够用markForCheck()来更新它
导入ChangeDetectorRef
import { ChangeDetectorRef } from '@angular/core';
注入并实例化它
constructor(private ref: ChangeDetectorRef) { }
最后标记变化检测发生
this.ref.markForCheck();
这里有一个例子,其中markForCheck()工作,而detectChanges()不工作。
https://plnkr.co/edit/RfJwHqEVJcMU9ku9XNE7?p=preview
编辑:这个例子不再描绘问题:(我相信它可能会运行一个更新的Angular版本,它的固定。
(按STOP / RUN再次运行)