Angular component, not updating frontend

I have a chatbot component that I charge in my app.component.html to access it everywhere.

<app-chatbot [enable]="this.enableSerenia"></app-chatbot>


In my chatbot component, I have multiples variables accessible from outside using @Input();

export class ChatbotComponent implements OnChanges {
@Input() enable: boolean = false;
@Input() actionsList: any[] = [];
@Input() messagesList: any[] = [];
@Input() showDialog: boolean = false;
@Input() newNotification: boolean = false;
}


In another component, I need to update some of thoses chatbot variables. So I declare it in my another component constructor, and update the variable like this :

constructor(
private serenia: SereniaChatbotComponent // EDISSYUM - NCH01 Implémentation SerenIA
) {
this.serenia.newNotification = true;
}



But the variable is not updated on my frontend. What do I need to "update" my frontend when I update my chatbot variable from another component ?

I'm under Angular 16

Continue reading...