передать массив из родительского компонента в дочерний угловой

Question

У меня есть 2 компонента: родитель и ребенок.Я хочу отправить массив из родительского в дочерний, когда я нажимаю кнопку (из родительского компонента) и вызываю функцию generate() для каждого объекта в массиве (в дочернем компоненте).Я пробовал что-то с @Output() EventEmitter, но я не уверен в этом подходе.

родительский компонент

export class ViewCalendarsComponent implements OnInit {
    @ViewChildren(MonthHeaderComponent) months: any[];
    @Output() monthsList: EventEmitter<Date[]> = new EventEmitter();

    selectedMonths: any[];

    test() {
        this.monthsList.emit(this.selectedMonths);
    }
}

дочерний компонент

export class MonthHeaderComponent implements OnInit {
    ngOnInit() {
    }
    generate(date: Date) {
        // code here....
    }

    show() {
        for (let i = 0; i <= monthsList.length; i++)
        {
            generate(monthsList[i]);
        }
    }

}

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

<button class="primary" (click)="test()"> Show </button>

  <div class="right view-calendar">
          <child *ngFor="let selectedMonth of selectedMonths" [monthsList]="show($event)"></child>
        </div>

Как я могу отправить этот массив и использовать его в качестве параметра в методе?

Answer 1

Просто используйте @input вместо output.И когда входное значение get изменяется, используйте ngOnChanges, чтобы перехватить изменения.

 child component
 export class MonthHeaderComponent implements OnInit {
    @Input monthsList: Date[]

   ngOnChanges(){
      // catch changes
   }
 }

В родительском шаблоне передайте массив.

<child *ngFor="let selectedMonth of selectedMonths" [monthsList]="monthArr"></child>