Блог

При нажатии кнопки я запускаю метод тестирования с i в качестве индекса элемента в массиве. Теперь, что происходит, так это то, что этот метод тестирования изменяет значение url (которое находится внутри объекта sMediaData) на null или «, а затем отправляет все sMediaData родительскому (SocialMediaComponent). и затем SocialMediaComponent отправляет sMediaData другому дочернему элементу SocialMediaComponent (SocialLinksComponent), и изменение не обнаружено в SocialLinksComponent.

 test(i) {
this.sMediaData = {
  profiles: []
};

if (this.d.length > 0) {

  this.d.forEach((val, id) => {
    if (val.data) {
     this.sMediaData.profiles.push(val);
    }
  });
}
this.sMediaData.profiles[i].icon.url = '';
const a = Object.assign({}, this.sMediaData);
this.socialLinksInputChange.emit(a);
}
  

Вот код SocialMediaComponent:

 HTML: 
<app-social (socialLinksInputChange)="processMediaData($event)"></app-social>
<app-socialLink [data]="data"></app-socialLink>


TS:
processMediaData($event){
this.data = $event;
}
  

Код компонента социальных ссылок:

 @Input() data: SocialMediaProfilesData;
ngOnChanges(changes: SimpleChanges): void {
console.log('YES 5', changes); // NOT DETECTING ANY CHANGES
}
  

нажмите на эту ссылку, чтобы просмотреть объект

Я бы изменил data поле в SocialMediaComponent

Для

data: BehaviourSubject<any> = new BehaviourSubject<any>(null)

Тогда ваш processMediaData() был бы

 processMediaData($event){
  this.data.next($event);
}
  

И SocialMediaComponent HTML

 <app-social (socialLinksInputChange)="processMediaData($event)"></app-social>
<app-socialLink [data]="data | async"></app-socialLink>
  

Доступ к данным внутри data выглядит следующим образом, если вам это нужно

 this.data.value
  

PS: Пожалуйста, замените any типы, которые я использовал