Developer Center

I have a child a component that does not fire the condition for *ngIf
child component:
export class child {
#Input() user;
#Input() list;
listLength: number;
showBtn: boolean = false;
constructor(){}
ngOnChanges(changes: SimpleChanges){
this.userId = this.user.id;
this.userList = this.list;
this.listLength = this.userList.length; // this updates everytime when changes happen on another component thats pushed from this component.
if (this.listLength > 3){ // this doesn't fire until I refresh the page
this.showBtn = true;
}

You probably also get an error output in the browsers console.
Invoke change detection explicitly if you update the model in ngOnChanges()
constructor(private cdRef:ChangeDetectorRef){}
ngOnChanges(changes: SimpleChanges){
this.userId = this.user.id;
this.userList = this.list;
this.listLength = this.userList.length; // this updates everytime when changes happen on another component thats pushed from this component.
if (this.listLength > 3){ // this doesn't fire until I refresh the page
this.showBtn = true;
}
this.cdRef.detectChanges();
}
}