Search code examples
angulareventemitterangular-components

Angular @Output emit works only the first time


Well... i have this on a child component:

this.event.emit(true);
this.calendarProviderService.addEvent(newEvent).subscribe(
    finished => {
        if (finished == true) {
            console.log (finished);
            this.event.emit(false);
        }
    }
)

Please check that the "True" emit is working well. On my parent component i have:

  <add-event *ngIf="currentActionArea == 'addevent'" (event)="addNewEvent($event)"></add-event>

addNewEvent(event){
    console.log("Emit recibido: " + event);
    if(event == true){
        this.loaderMessage = "Guardando Evento...";
        this.loadingEvents = true;
    } else {
        this.switchButtonModel = '0';
        this.currentActionArea = null;
        this.getEvents();
    }
}

But when the subscription is finnished, then the "false" emit it not works.

Can you help me?


Solution

  • The problem was that i use a service to set the emmitter value. This is not a best practice. I solved this using an Subject:

    import { Subject } from "rxjs/Subject";
    
    @Injectable()
    export class CalendarProviderService {
    
    /**
     * To emit getActivityWork between two components
     */
    private _activityWorkSubject = new Subject<calendarActivityWork>();
    public getActivityWork = this._activityWorkSubject.asObservable();
    
        constructor() { }
    
        /**
         * To set the activity work value
         * @param calendarActivity the activity to show
         */
        doActivityWork(calendarActivity : calendarActivityWork){
            return this._activityWorkSubject.next(calendarActivity);
        }
    .
    .
    .
    

    Hope this can help to anybody.