CODEWITHSUNDEEP
angulartypescripteventsdialogangular-event-emitter
AnaCS
AnaCS

Reputation: 1011

event emitter works one time but not a second time Angular 8

I have this variable which controls if a dialog shows up or not, it works on the first time, but not on a second time, emit excutes but the receiveing function is no longer called.

parent class:

  isLogin :boolean ;

  constructor(...){
    this.isLogin = false;
}
  receiveNotification(notification: boolean): void {
    this.isLogin = notification;
  }

parent html:

<login-dialog   *ngIf="!isLogin"  name="{{name}}" (notify)="receiveNotification($event)"></login-dialog>

in the child class: I have a function that when triggered calls emit and emit is indeed called just doesn't trigger the function on the parent on a second time 

@Output() notify = new EventEmitter<any>();

  exampleFunction(){
 this.notify.emit(true);
}

I think maybe this is connected to the ngIf but not sure, what is wrong here?

Upvotes: 5

Views: 5037

Answers (2)

ilyas shabi
ilyas shabi

Reputation: 194

Try to use hidden instead of ngIf, because ngIf remove the component from the DOM but hidden just hide it.

<login-dialog   [hidden]="isLogin"  name="{{name}}"...></login-dialog>

Upvotes: 2

Nicholas K
Nicholas K

Reputation: 15423

It could be because you are emitting a true value but on the parent template you are checking for !true which is false.

As per your current logic, you should either emit a false value or change the condition to *ngIf="isLogin" in the parent template.

Upvotes: 4

Related Questions