angular2 ngOnChanges not working for multiple inputs

Question

I am working on this angular2 app in which I am accepting two inputs in one component.

I have used ngOnChanges to detect changes on these input values.

@Input() games: any;
@Input() selectedGame:any;

ngOnChanges(changes: {[propName: string]: SimpleChange}) {    
    this.selectedGame=changes['selectedGame'].currentValue;  //this works
    this.games=changes['games'].currentValue;    //this doesn't work
}

However, I can only detect change in first variable. the second variable is not getting updated when its value changes in parent.

any inputs?

Answer 1

Depending on the change from the parent component, ngOnChanges might be triggered separately for each Input changed. You need to check which Input has changed first.

ngOnChanges(changes: SimpleChange}) {   
    if(changes['selectedGame'] !== undefined)
        this.selectedGame=changes['selectedGame'].currentValue;

    if(changes['games'] !== undefined)
        this.games=changes['games'].currentValue;
}

Here's the working plunk https://plnkr.co/edit/n6X21VHXw1xlA8XCPoQu