以角度2+取消http请求

Question

我想通过点击按钮取消运行请求

当http请求调用时，加载程序正在运行，但大部分时间请求需要更长的时间，因此我想在运行时取消该请求

这是我的HTML代码

<div *ngIf="progress.state | async; let state">
    <div class="loading-icon" *ngIf="state.active">
        <button class="btn btn--primary" (click)="cancelRequest()">Cancle Request</button>
    </div>
</div>

这是我的loader.ts文件

import { HttpModule, BrowserXhr } from '@angular/http';
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { NgProgressModule, NgProgressBrowserXhr } from 'ngx-progressbar';
import { SpinnerComponent } from './spinner.component';

@NgModule({
  imports: [
    CommonModule,
    HttpModule,
    NgProgressModule
  ],
  declarations: [
    SpinnerComponent
  ],
  providers: [
      { provide: BrowserXhr, useClass: NgProgressBrowserXhr },
  ],
  exports:[
    SpinnerComponent
  ]
})
export class PageloaderModule {
  cancelRequest(){

  }
 }

我试图在http拦截器中设置一个布尔变量但不能正常工作

那么如何取消正在运行的http请求