https://stackoverflow.com/questions/41389124/angular-2-how-to-make-child-component-wait-for-asyn-data-to-be-ready

async

There are three ways to do this:

1) Put an *ngIf in parent. Only render child when parent's items is ready.
<div *ngIf="items">
   <child [items]="items | async">
</div>

2) Separate your input getter setter in child. Then act whenever the value is set, you can use RxJS BehaviorSubject also.
private _items = new BehaviorSubject<Items[]>([]);
@Input() set items(value: Items[]) { 
    this._items.next(value); 
}
get items() {
   return this._items.getValue();
}
ngOnInit() {
    this._items.subscribe(x => {
       this.chunk(x);
    })
}

3) Do it during the ngOnChanges of the child.
Refer to here for example. https://angular.io/docs/ts/latest/guide/lifecycle-hooks.html#!#onchanges