Angular 2 OnPush动态组件的变化检测
发布时间:2020-12-17 07:11:38 所属栏目:安全 来源:网络整理
导读:我有一个Angular组件,可以在其自身内部动态创建各种其他类型的组件.它通过OnChanges钩子将自己的属性绑定到子组件@Input属性. 当子组件的更改检测设置为“默认”时,此绑定可正常工作.然后检测新输入并更新组件模板. 但是,当更改检测为OnPush时,它不起作用,则
我有一个Angular组件,可以在其自身内部动态创建各种其他类型的组件.它通过OnChanges钩子将自己的属性绑定到子组件@Input属性.
当子组件的更改检测设置为“默认”时,此绑定可正常工作.然后检测新输入并更新组件模板. 但是,当更改检测为OnPush时,它不起作用,则不会检测到更改.我认为应该检测到更改,因为新的不可变对象(字符串)被分配给组件@Input属性. 这是一个演示者: 如何将此父级到动态子属性绑定与ChangeDetectionStrategy.OnPush一起使用? 解决方法
OnPush组件的可能解决方法是将setter与cdRef.markForCheck()一起使用:
改变检测用onpush.component.ts @Component({ selector: 'app-change-detection-onpush',template: ` <div> ChangeDetectionStrategy.OnPush: {{ message || '[blank]' }} </div>`,changeDetection: ChangeDetectionStrategy.OnPush }) export class ChangeDetectionOnPushComponent implements IMyComponent { private _message: string; constructor(private cdRef: ChangeDetectorRef) {} set message(val: string) { this.cdRef.markForCheck(); this._message = val; } get message() { return this._message; } } Modified Plunker (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |