Угловая передача данных между компонентами с использованием Input() не вызывает ngOnChanges

#angular

Вопрос:

У меня есть два компонента-родительский и дочерний, я использую @Input() для передачи данных между родительским и дочерним компонентами. При инициализации это работает, я получаю данные от родителя. но после изменения этих данных они не отразились в компоненте дочернего ввода.

Я не использую стратегию OnPush.

контакты-в-компании.компонент — html, который включает компонент «контакты-в-компании-результаты» следующим образом;

 <contacts-at-company-results
      *ngIf="!isPersonSearchLoading amp;amp; isShowingResults amp;amp; !showFilters"
      [personList]="personList">

    </contacts-at-company-results>
 

Список персон-это входные данные в компонентах контакты в компании-результаты

когда я изменяю список персон в коде, он не отражается в дочернем компоненте, и ngOnChanges не вызывается.

 export classContactsAtCompanyResultsComponent implements OnInit, OnChanges {
 @Input() personList;
ngOnChanges(changes: SimpleChanges) {
    alert(changes);
  }
 

в родительском:

   updateSearchResults(data) {
      this.personList = [...data];
  }
 

Комментарии:

1. Является personList ли массивом? Если да, я бы попробовал this.personList = [...data] войти updateSearchResults .

Ответ №1:

Попробуйте создать новую ссылку

 updateSearchResults(data) {

 this.personList = [... data] ;

 }
 

Ответ №2:

ngOnChanges() вызывается только тогда, когда обнаружение изменений обновляет привязку к @Input(). Если входные данные где-то изменяются в обязательном порядке, то они не вызываются.

Просто сделайте personList геттер/сеттер для кода, который будет выполняться каждый раз при обновлении свойства.