Javascript 如何跟踪angular 2服务调用的进度

我听说我们使用服务与数据库或其他数据存储库进行通信。在执行查询时，我希望能够在UI上显示一个进度条

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

您可以选择任何一个模块

否则，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;
      }
    });
  }
}

从'rxjs/Subject'导入{Subject}；
导出类ProgressLoader{
百分比$：受试者；
构造函数（）{
此.percentage$=新主题（）；
$.ajax({
键入：“GET”，
网址：'http://google.com',
xhr:function（）{
var xhr=new window.XMLHttpRequest（），
xhr.addEventListener（“进度”（evt）=>{
this.percentage$.next（parseInt（evt.loaded/evt.total*100，false）+'%'）；
}，假）；
返回xhr；
}
});
}
}

ok。因此，我的问题是，您必须使用可观察对象来管理组件中的百分比？@arcee123您可以使用EventEmitter发出新的百分比值，并在视图中使用的组件中订阅它（上面更新的代码）。