Передача данных из вложенных компонентов Angular 2

Question

У меня есть компонент, где с *ngFor распечатать некоторые поля, определенные в другом компоненте, как это:

<div>
 <commponentB *ngFor="let a of list"></componentB>
</div>

где "список" - это список объектов типа ОК:

this.list=[{"id":"3","nome":"app3","posizione":3},{"id":"1","nome":"app1","posizione":1},{"id":"2","nome":"app2","posizione":2}];

Я должен заполнить все компоненты. Как я могу передать данные из этих двух компонентов?

TY

EDIT1:

проблема в том, что список делится на 2 списка для повторения в 2 разных столбцах начальной загрузки, поэтому ситуация такова:

<div>
 <commponentB *ngFor="let a of list1"></componentB>
</div>
<div>
 <commponentB *ngFor="let a of list2"></componentB>
</div>

и компонент такой:

<div>
<span>{{name}}</span>
</div>

если я пропущу весь список, я не могу знать, как правильно заполнить компонент (извините, если я не очень хорошо объясню проблему)

Answer 1

Если вы хотите передать свой список в componentB, вы можете определить свойство Input() в componentB, а затем передать свой список

<div>
 <commponentB [list]="list"></componentB>
</div>

export class ComponentB{

@Input() list: any[];

}

Обновление Хорошо, возможно, я не получаю вашу проблему, даже если вам нужно передать разные входные данные одному и тому же компоненту, вы можете сделать это. Проверьте этот поршень:

Answer 2

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

Вот ссылка из официальной документации:

https://angular.io/guide/component-interaction

---

Если вы не можете сделать эту модель из-за взаимодействия с маршрутизатором, или компоненты находятся слишком "далеко", так что слишком много работы по настройке нескольких входов, вы можете использовать общую службу для обмена данными от одного компонента к другому.

https://angular.io/guide/component-interaction