Угловое дочернее обновление родителя и ExpressionChangedAfterItHasBeenCheckedError

Question

Так что я понимаю «почему» получения ExpressionChangedAfterItHasBeenCheckedError на Angular, но я просто не могу понять, как это исправить, основываясь на статьях, которые я читаю.У меня есть сервис, который определяет наблюдаемое, например так:

private classification = new BehaviorSubject<string>('Assumed to be A');
public hazardClassification$ = this.classification.asObservable();

public setClassification(value: string): void {
    this.classification.next(value);
}

В дочернем компоненте, где я определяю значение, я устанавливаю его из ngOnInit:

ngOnInit(): void {
    this.hazardClassificationService.setClassification(this.hazardClassification);
    this.valueChanges = this.thisTabFormGroup.valueChanges.subscribe(() => this.hazardClassificationService.setClassification(this.hazardClassification));
}

В родительском компоненте я беру это наблюдаемое так:

ngAfterContentChecked(): void {
    this.hazardClassification$ = this.hazardClassificationService.hazardClassification$;
}

, а затем отображаю его в HTML-коде родителя через hazardClassification$ | async.

Что я пробовал такfar присваивает наблюдаемое у родителя в ngOnInit, ngAfterContentChecked и ngAfterContentInit.Ни один из них не является правильным местом.

Answer 1

Попробуйте позвонить this.classification.next(value) внутрь setTimeout:

public setClassification(value: string): void {
    setTimeout(() => {
        this.classification.next(value);
    });
}