Encountering issues with passing an Array of data between components using @Input. Here is the code snippet:
public ngOnInit() {
this.applications = new Array<ApplicationEntryInterface>();
(...)
let shortTermData = new ShortTermApplicationAdapter(application);
this.applications.push(shortTermData);
console.log(this.applications);
}
The console log displays a normal array https://i.sstatic.net/v4eEM.jpg in parent.component.html.
<student-application-overview [applicationsEntry]="applications"></student-application-overview>
Child component:
@Input('applicationsEntry') public applicationsEntry: Array<ApplicationEntryInterface>;
ngOnChanges() {
console.log(this.applicationsEntry);
console.log(this.applicationsEntry.length); <--- shows 0
}
This results in https://i.sstatic.net/bW7Hx.jpg. It appears impossible to iterate through it using for loops, foreach loops, etc. Only *ngFor seems to work, as this.applicationsEntry.length remains at 0. How can I address this issue? I have also tried utilizing @Input (..) set (..) { (..) } with no success.