Angularjs   发布时间:2022-04-20  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了angular – 更改检测问题 – 为什么当它与On Push相同的对象引用时会发生变化大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我认为在讨论之后我对Angular Change检测的工作方式非常清楚: Why is change detection not happening here when [value] changed?

但看看这个插件https://plnkr.co/edit/jb2k7U3TfV7qX2x1fV4X?p=preview

@Component({
SELEctor: 'simple',template: `
    <div (click)="onClick()">
      {{myData[0].namE}}
    </div>
  `,changeDetection: ChangeDetectionStrategy.onPush
})
export class Simple {
  public @input() myData;
  constructor() {
  }
  public onClick() {

  }
}

点击a,它改为c

据我所知,click事件触发了应用程序级别的更改检测,但[myData] =“testData”仍然引用同一个对象,我使用On Push on Simple,为什么会更改?

这是设计的.

如果你有带OnPush变化检测的组件,那么除非发生以下四种情况之一,否则不会触发其detectChangesInternal函数

1)其中一个@Inputs发生了变化

〜2.4.x的

〜4.x.x

注意:@Inputs应该在模板中显示.见问题https://github.com/angular/angular/issues/20611comment

2)从组件触发绑定事件(这是你的情况)

注意事项:2.x.x和4之间存在一些差异

Angular ChangeDetectionStrategy.OnPush with child component emitting an event

〜2.4.x的

〜4.x.x

3)手动标记要检查的组件(ChangeDetectorRef.markForcheck())

4)异步管道在内部调用ChangeDetectorRef.markForcheck()

private _updateLatestValue(async: any,value: Object): void {
  if (async === this._obj) {
    this._latestValue = value;
    this._ref.markForcheck();
  }
}

https://github.com/angular/angular/blob/2.4.8/modules/%40angular/common/src/pipes/async_pipe.ts#L137

换句话说,如果您为组件设置OnPush,那么在第一个检查组件的状态将从checkOnce更改为checked之后,只要我们不更改状态,它就会等待.它将发生在上述三件事之一.

也可以看看:

> https://github.com/angular/angular/issues/11678#issuecomment-247894782

对angular2变化检测的工作方式也有很好的解释:

> https://blog.thoughtram.io/angular/2016/02/22/angular-2-change-detection-explained.html
> https://hackernoon.com/everything-you-need-to-know-about-change-detection-in-angular-8006c51d206f

这是Live Example(感谢Paskal)解释onPush变化检测. (Comp16看起来像你的组件.你可以点击这个框).

大佬总结

以上是大佬教程为你收集整理的angular – 更改检测问题 – 为什么当它与On Push相同的对象引用时会发生变化全部内容,希望文章能够帮你解决angular – 更改检测问题 – 为什么当它与On Push相同的对象引用时会发生变化所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。