Angular emit inside a promise not working

Viewed 436

In my Angular project I want to emit inside the .then and .catch, but they do net get called. Everything else inside the .then and .catch does get called.

When I emit outside the promise it does work.

This is my code

updateAssignee(newAssignee: string) {
    this.storyService.updateAssignee(this.story, newAssignee).then(res =>{
      console.log('test')     //This one gets called
      this.onError.emit({     //This one does not get called
        error: false,
        errorText: ''
      });
    }).catch((error) => {
      console.log('test')     //This one gets called
      this.onError.emit({     //This one does not get called
        error: true,
        errorText: '• ' + error.message
      });
    });

    this.onError.emit({     //This one gets called
      error: false,
      errorText: '• Missing permissions'
    });
  }

Is it not possible to emit inside the .then and .catch? Or am I missing something?

The way these components are loaded is via a ngFor loop. Maybe this causes some problems?

<span *ngFor="let story of done">
    <app-storyboard-story (onError)="throwError($event)" [story]="story" [project]="project" cdkDrag></app-storyboard-story>
</span>
1 Answers

UPDATED

Based on the code sample looks like ngFor detects changes and unsubscribes from the children components.

The solution would be to implement trackBy https://angular.io/api/common/NgForOf, that should help to keep instances of children components when the done has been changed.

ORIGINAL

In the above above nothing is broken. You can verify that it works via adding

this.onError.subscribe(console.log);

before this.storyService call.

I would suggest you to investigate how the listener subscribes and unsubscribes and change its flow because looks like it unsubscribes (call ngIf or something that removes the component from the render) too early.

With the provided code it's impossible to give you better advice.

Related