为什么在组件内部调用 detectorChanges() 不会更新值,但将代码包装在 setTimeout() 中却可以?

2024-03-23

我试图从选项集中自动选择第一个值<mat-autocomplete ...>

export class ExampleComponent implements OnInit, AfterViewInit {

@ViewChildren('auto') matAutocomplete: QueryList<any>;

constructor(private cdr: ChangeDetectorRef) { }

ngAfterViewInit() {
    this.foundItemsList.changes.subscribe(options => {
        // ---> This simply works!
        setTimeout(() => this.matAutocomplete.first._keyManager.setFirstItemActive(), 0);

        // ---> This doesn't works?! No error shown, it just seems that the above function isn't called at all. 
        this.matAutocomplete.first._keyManager.setFirstItemActive()
        this.cdr.detectChanges();
    });
}

https://github.com/angular/material2/blob/master/src/lib/autocomplete/autocomplete.ts https://github.com/angular/material2/blob/master/src/lib/autocomplete/autocomplete.ts

据我所知,什么detectChanges是否检查当前组件及其所有子组件的更改检测器,对吗?但在上面的场景中似乎不起作用。


this.cdr.detectChanges()仅对当前组件(及其后代)运行更改检测。如果setFirstItemActive()导致其他地方发生变化,这不包括在内。setTimeout() or zone.run(...) or ApplicationRef.tick()导致对整个应用程序运行更改检测,因此覆盖每个绑定,而不仅仅是当前组件。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

为什么在组件内部调用 detectorChanges() 不会更新值,但将代码包装在 setTimeout() 中却可以? 的相关文章

随机推荐