[英]Angular Dynamic Components and ExpressionChangedAfterItHasBeenCheckedError
[英]ExpressionChangedAfterItHasBeenCheckedError during dynamic template management in Angular
我需要动态管理模板。 我想显示或隐藏一些基于WebSocket消息或用户交互后更改的参数的视图。 我为此使用ngIf,但是有时(尤其是当我重新加载视图时,消息很快出现)控制台收到一个错误
ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: 'ngIf: true'. Current value: 'ngIf: false'.
我使用Angular 8
主要成分
export class MainComponent implements AfterViewInit, OnInit {
public view_config;
constructor(public pluginInfoService: PluginInfoService){}
ngOnInit() {
this.pluginInfoService.getViewConfig().subscribe(view_config => {
this.view_config = view_config;
});
}
}
主要组件模板
<popup-window *ngIf="view_config.show_popup_window" class="overflow_hidden h-100 w-100" [view_config]="view_config">
<select-media *ngIf="view_config.popup_window_mode == 'select_media'" [view_config]="view_config" class="container-fluid h-100"></select-media>
<get-contact-name *ngIf="view_config.popup_window_mode == 'get_contact_name'" [view_config]="view_config" class="container-fluid h-100"></get-contact-name>
<chat-view *ngIf="view_config.popup_window_mode == 'chat_view'" class="container-fluid h-100 flex-column d-flex p-0"></chat-view>
<change-media-invitation *ngIf="view_config.popup_window_mode == 'media_change_invite'" [view_config]="view_config" class="container-fluid h-100"></change-media-invitation>
</popup-window>
插件信息服务
export class PluginInfoService {
private view_config = {
show_main_button: true,
show_popup_window: true,
popup_window_mode: 'select_media',
show_popup_media_window: false,
popup_media_window_mode: null,
minimize_popup_window: false
};
private viewConfigStream = new BehaviorSubject(this.view_config);
constructor() {
}
setViewConfigParam(param, value) {
this.view_config[param] = value;
this.viewConfigStream.next(this.view_config);
}
getViewConfig(): Observable<any> {
return this.viewConfigStream.asObservable();
}
}
该机制已经起作用,但我想它会带来更多问题。 首先,我不想出现此错误,其次,我想确保所有操作均正确执行。 如何解决这个问题? 这种方法好吗?
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.