[英]Angular2: Example with multiple http calls (typeahead) with observables
所以我正在我的应用程序中处理一些情况,我需要进行以下操作
事件触发后,请执行以下操作
提前输入功能几乎是标准的
我想与此一起使用可观察对象...,如果先前的通话正在运行,我可以取消它们
有什么好的教程吗? 我环顾四周,找不到远程最新信息
好,给你一些线索,我现在做了什么:
onChartSelection(chart: any){
let date1:any, date2:any;
try{
date1 = Math.round(chart.xAxis[0].min);
date2 = Math.round(chart.xAxis[0].max);
let data = this.tableService.getCachedChartData(this.currentTable, date1, date2);
if(data){
this.table.data = data;
}else{
if(this.chartTableRes){
this.chartTableRes.unsubscribe();
}
this.chartTableRes = this.tableService.getChartTable(this.currentTable, date1, date2)
.subscribe(
data => {
console.log(data);
this.table.data = data;
this.chartTableRes = null;
},
error => {
console.log(error);
}
);
}
}catch(e){
throw e;
}
}
这里缺少去抖
-我最终实现了lodash的去抖动
import {debounce} from 'lodash';
...
onChartSelectionDebaunced: Function;
constructor(...){
...
this.onChartSelectionDebaunced = debounce(this.onChartSelection, 200);
}
对于debaunce可以使用Underscore.js 。 该函数将如下所示:
onChartSelection: Function = _.debounce((chart: any) => {
...
});
关于Observable的取消,最好使用Observable方法share 。 在您的情况下,应通过在返回的Observable中添加.share()
来更改getChartTable
中的tableService
方法。
这样,即使您多次订阅服务器,也只会对服务器进行一次调用(如果没有,则每个新订阅都会调用新调用)。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.