TypeError: finalizer.unsubscribe is not a function Angular Ionic-CodePudding

I seem to be having an issue with posting to the api, I know I'm using a base class but I'm unsure how to rectify the issue below.

Any help appreciated.

    core.mjs:7635 ERROR Error: Uncaught (in promise): UnsubscriptionError: 1 errors occurred during unsubscription:
1) TypeError: finalizer.unsubscribe is not a function
Error
    at _super (createErrorClass.js:4:26)
    at new UnsubscriptionErrorImpl (UnsubscriptionError.js:3:5)
    at OperatorSubscriber.unsubscribe (Subscription.js:55:23)
    at OperatorSubscriber.unsubscribe (Subscriber.js:55:19)
    at OperatorSubscriber.unsubscribe (OperatorSubscriber.js:51:19)
    at OperatorSubscriber._complete (OperatorSubscriber.js:42:26)
    at OperatorSubscriber.complete (Subscriber.js:49:18)
    at Observable.<anonymous> (job.service.ts:248:16)
    at Generator.next (<anonymous>)
    at asyncGeneratorStep (asyncToGenerator.js:3:1)
    at resolvePromise (zone.js:1262:35)
    at zone.js:1169:21
    at zone.js:1185:37
    at asyncGeneratorStep (asyncToGenerator.js:6:1)
    at _next (asyncToGenerator.js:25:1)
    at _ZoneDelegate.invoke (zone.js:409:30)
    at Object.onInvoke (core.mjs:26231:33)
    at _ZoneDelegate.invoke (zone.js:408:56)
    at Zone.run (zone.js:169:47)
    at zone.js:1326:38

and the problematic code,

return Observable.create(async (observer) => {
      const result = await this.convertNativeImagesToBase64(isMobile);
      observer.next(result);
      observer.complete()
    }).pipe(
      mergeMap(() => {

        return this.apiService.sendIssue(payload).pipe(map((response: any) => {
    
            return response;
          },
        ));
      }),
      catchError((error) => {
        const errorMessage = this.getErrorMessage(error, "Failed.");
        const failed: any = { Success: false, Message: errorMessage };
        return throwError(failed);
      })
    )

CodePudding user response：

The issue migh be with Observable.create since you don't return anything. Try another operator for promise

return from(this.convertNativeImagesToBase64(isMobile)).pipe(
      mergeMap(() => {

        return this.apiService.sendIssue(payload).pipe(map((response: any) => {
    
            return response;
          },
        ));
      }),
      catchError((error) => {
        const errorMessage = this.getErrorMessage(error, "Failed.");
        const failed: any = { Success: false, Message: errorMessage };
        return throwError(failed);
      })
    )

or with defer to make promise lazy and wait for subscription rather then execute immidiatly

return defer(() => this.convertNativeImagesToBase64(isMobile)).pipe(
      mergeMap(() => {

        return this.apiService.sendIssue(payload).pipe(map((response: any) => {
    
            return response;
          },
        ));
      }),
      catchError((error) => {
        const errorMessage = this.getErrorMessage(error, "Failed.");
        const failed: any = { Success: false, Message: errorMessage };
        return throwError(failed);
      })
    )