如何跟踪角度2服务呼叫的进度

Question

我告诉我们使用服务与数据库或其他数据存储库进行通信。当查询正在执行时，我希望能够在UI上设置进度条。

如何跟踪完成百分比？ 感谢

Answer 1

您可以refer this to do it sanely with angular2 HTTP模块。

否则在jQuery中使用XHR progress事件也可以这样做：

import { Subject } from 'rxjs/Subject';
export class ProgressLoader {
  percentage$: Subject<any>;

  constructor() {
    this.percentage$ = new Subject();
    $.ajax({
      type: 'GET',
      url: 'http://google.com',
      xhr: function() {
        var xhr = new window.XMLHttpRequest(),

        xhr.addEventListener("progress", (evt) => {
         this.percentage$.next(parseInt(evt.loaded / evt.total * 100, false) + '%');
        }, false);
        return xhr;
      }
    });
  }
}