我在 AppComponent
的构造函数中订阅 ngrx
存储:
export class AppComponent {
submenuItems: Observable<Array<INavigationBarItem>>;
constructor(private store: Store<AppState>) {
this.submenuItems = this.store.select<Array<INavigationBarItem>>((state: AppState) => state.submenu.items);
}
}
然后,我在其他组件的 ngOnInit
方法中分派(dispatch)一个操作,如下所示:
export class SearchPageComponent implements OnInit {
constructor(private store: Store<AppState>) { }
ngOnInit(): void {
this.store.dispatch(new SubmenuAction([
{ title: 'Search', isActive: true },
{ title: 'New Group' }
]));
}
}
此交互的结果是 ExpressionChangedAfterItHasBeenCheckedError
异常。如果我将 dispatch
调用移动到我的子组件的构造函数,则不会引发任何错误,但我想知道这是否只是偶然。此外,我认为将其放入构造函数体内不是一个好主意。
我的每个组件都需要调用此 store.dispatch
- 如您所见,它的目的是生成一个子菜单数据,该数据因页面而异。如何解决这个异常?
最佳答案
我遇到过几次这个问题,并认为这可能是 Angular 区域管理的问题。我所做的更像是黑客攻击,但也许它也能解决您的问题:
ngOnInit(): void {
setTimeout(() => this.store.dispatch(new SubmenuAction([
{ title: 'Search', isActive: true },
{ title: 'New Group' }
])), 0);
}
关于angular - 从 ngOnInit 调度操作时出现 ExpressionChangedAfterItHasBeenCheckedError,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45282565/