Angular cancel http request

// http-cancel.service.ts
// use this service as DI in component
import {Subject} from 'rxjs';
import {Injectable} from '@angular/core';

@Injectable()
export class HttpCancelService{
  private cancelPendingRequestSubject=new Subject<void>()
  cancelPendingRequest$ = this.cancelPendingRequestSubject.asObservable();

  cancelPendingRequest(){
    this.cancelPendingRequestSubject.next();
  }
}

==============================================================
//http-cancel-interceptor.service.ts
import {HttpEvent, HttpHandler, HttpInterceptor, HttpRequest} from '@angular/common/http';
import {Observable, takeUntil} from 'rxjs';
import {Injectable} from '@angular/core';
import {HttpCancelService} from './http-cancel.service';
import {tap} from 'rxjs/operators';

@Injectable()
export class CancelInterceptor implements HttpInterceptor{
  constructor(private cancelService: HttpCancelService) {
  }

  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    return next.handle(req).pipe(takeUntil(this.cancelService.cancelPendingRequest$
      .pipe(tap(()=> {throw new Error('Request is canceled')}))));
  }
}
==============================================================
 // app.module.ts
  import {HTTP_INTERCEPTORS} from '@angular/common/http';
  ...
  providers: [
    ...
    {provide: HTTP_INTERCEPTORS, useClass: CancelInterceptor, multi: true}
    ...
  ],

Similar codes

-1 vote107 views1 answer
Typescript declaring null
TypeScript
1 vote123 views1 answer
Ion2 calendar locale
TypeScript
0 vote137 views5 answers
How to css after elements for background overlays
TypeScript
0 vote115 views1 answer
The html element that houses all html element that contains meta information about the web page,importing external stylesheets and internal ces
TypeScript
57 votes268 views3 answers
How to check list of open ports in linux
TypeScript
-1 vote108 views1 answer
Whats a company letterhead
TypeScript
0 vote108 views1 answer
Angular material date picker add dates automatically
TypeScript
0 vote106 views1 answer
Adding API request
TypeScript
0 vote120 views1 answer
Meta tag utf-8 means kya hota hai
TypeScript
0 vote121 views1 answer
Vb net code snippets for storing password
TypeScript