Блог

Я использовал модальность ng-bootstrap, я попытался открыть модальность при отправке данных из первого компонента в компонент sencons в ngOnChanges, но я получаю следующую ошибку:

ExpressionChangedAfterItHasBeenCheckedError: выражение изменилось после проверки. Предыдущее значение: ‘имя_класса: не определено’. Текущее значение: ‘имя_класса: модальное отображение фона с исчезновением’. Похоже, что представление было создано после того, как его родительский элемент и дочерние элементы были проверены на наличие ошибок. Было ли оно создано в перехватчике обнаружения изменений?

Первый компонент:

  public openPopup(event): void {
        if (event) {
            this.agreement = event;
        }
 }

 <ef-cp1(openPopup)="openPopup($event)"></ef-cp1>
 <ef-cp2 [agreement]="agreement"></ef-cp2>
  

Второй компонент (ef-cp2):

   @Input()
  public agreement: any;

  ngOnChanges(changes: SimpleChanges) {
    if (changes["agreement"] amp;amp; changes["agreement"].currentValue) {
      const modal: NgbModalRef = this.initPopUp();
      modal.componentInstance.agreement = changes["agreement"].currentValue;
    }
  }

 private initPopUp(): NgbModalRef {
    return this.modalService.open(NewComponent,
      {
        size: 'lg',
        windowClass: 'modal-adaptive',
        ariaLabelledBy: 'modal-basic-title',
        keyboard: false,
        backdrop: 'static',
        centered: true
      });
  }
  

ngOnChanges выполняется перед ngOnInit, поэтому вы можете подумать о том, что вы здесь делаете — трудно сказать наверняка с вашей ограниченной информацией

возможно, в ngOnChanges установлена переменная, подобная

 agreementChanged = true
  

затем в ngAfterContentInit выполните

 if (agreementChanged) 
{
 this.initPopUp();
 agreementChanged = false
}