奇数变化检测行为2+

你的 loaderOverlay$ 发射值评估为 true

https://stackblitz.com/edit/angular-ngrx-update?file=src/app/app.component.css

稍后编辑:

正如克里斯蒂安·特拉纳在评论中指出的, markForCheck (从异步管道内部)从外部调用时不会触发更改检测。作为修复,您可以在管道中使用区域调度器,或者检测更改来自何处,并修补该区域以触发angular内部的更改检测(因为应用程序的其他区域可能存在问题)。

https://www.npmjs.com/package/ngx-zone-scheduler?activeTab=readme

public constructor(
  @Inject(ZoneScheduler)
  private readonly zoneScheduler: SchedulerLike,
) {}

this.loaderOverlay$ = this.store.pipe(
  select(selectors.loaderOverlaySelector),
  observeOn(this.zoneScheduler),
);

或者你可以 tick 这个 appRef

public constructor(
  private appRef: ApplicationRef,
) {}

this.loaderOverlay$ = this.store.pipe(
  select(selectors.loaderOverlaySelector),
  tap(_ => this.appRef.tick()),
);

onPush 策略没有被正确使用。这个 策略意味着如果组件的 @inputs @input 引用没有更改,这意味着更改检测没有按预期进行。

defaultStrategy 或手动呼叫 markForCheck() 根据需要触发更新。

我也有类似的问题。通过编辑输入字段,结果将从后端获取并显示在列表中。除非我将鼠标悬停在其他位置或单击其他位置,否则列表不会更新。

我通过在从后端获取数据后添加一个手动更改检测来修复它。

constructor(private cd: ChangeDetectorRef) {}

fetchData.subscribe(results => {
   AddResultsToStore(results);
   this.cd.detectChanges();
});