angular – 取消Observable.create中的HTTP请求

我有一个服务,它返回一个rxjs Observable,其中有一些异步任务,然后是一个递归的HTTP请求.它是一个分块上传,因此在前一个块的成功处理程序中有多个顺序请求被触发.

我想知道在处理包含Observable时如何取消内部HTTP请求.

这基本上就是我正在做的事情(不是真正的代码)：

// UploadService

upload (file) {
    return Observable.create((observer) => {

        let reader = new FileReader();

        // convert file into chunks
        let chunkedFile = this.chunkFile(file);

        reader.onloadend = (event) => {

            // THIS IS THE REQUEST I WANT TO CANCEL
            this.http.put('url/to/upload/to',chunkedFile.currentChunk)
                .subscribe((res) => {

                    // emit some data using containing observable,e.g. progress info
                    observer.next(res);

                    // trigger upload of next chunk
                    this.uploadFileInChunks(reader,chunkedFile,observer);

                });
        };

        // this triggers the onloadend handler above
        this.uploadFileInChunks(reader,observer);
    });
}

然后我在我的组件中使用它,如下所示：

// ExampleComponent

upload () {
    this.uploader = this.uploadService.upload(file)
        .subscribe((res) => {
            // do some stuff,e.g. display the upload progress
        })
}

ngOnDestroy () {
    // when the component is destroyed,dispose of the observable
    this.uploader.dispose();
}

我可以在网络面板中看到,在销毁组件后,上传进度仍然继续.

我该如何取消？

如果它有助于理解上传,那么我使用这个https://github.com/kinstephen/angular-azure-blob-upload移植到Angular 2