我是Angular 4.3的新手.我有一个地图应用程序,通过下载一系列小图像(“图块”)呈现“地图图层”.在启动时,地图图层可能需要0.1到5.0秒才能下载.
当客户端收到两个或多个磁贴时,我需要触发一个事件.我原本以为我可以通过订阅一个Observable来实现这个目标,它可以在200ms的间隔内重试30次.
至今：
public updateTileContainer() {
this._getTileContainer().subscribe(container => {
if (container) {
console.log('* do stuff with container *');
}
});
}
private _getTileContainer(): Observable<any> {
return Observable.interval(200)
.mergeMap(function (n) {
const tileImages = $('#mymap').find('img[src*=\'kml\']');
console.log(`Retry ${n}: ${tileImages.length} tiles found`);
if (!tileImages || tileImages.length < 2) {
return Observable.of(null);
}
const tileContainer = getContainer(tileImages);
return Observable.of(tileContainer);
})
.take(30);
}
这有效！有点.我得到这个输出：
Retry 0: 0 tiles found Retry 1: 0 tiles found Retry 2: 0 tiles found Retry 3: 0 tiles found Retry 4: 0 tiles found Retry 5: 0 tiles found Retry 6: 0 tiles found Retry 7: 2 tiles found * do stuff with container * Retry 8: 3 tiles found * do stuff with container * Retry 9: 9 tiles found * do stuff with container * Retry 10: 12 tiles found * do stuff with container * etc.
我实际上要做的是在“重试7”中发出单个事件,然后停止发射.
如何在找到容器后立即将其更改为“完成”Observable？我怎样才能“跳过”重试0到6的事件,因为它们不是真正的事件？如果在没有找到容器的情况下进行30次重试,我可以从Observable中抛出一个错误吗？
解决方法
使用.retry(count)
如果您选择的内容少于2个,则可以抛出错误.然后重试()30次.
注意：在第30次重试之后,实际会发出错误并且您需要处理它.但这可能是一件好事(见进一步).
public updateTileContainer() {
this._getTileContainer().subscribe(container => {
console.log('* do stuff with container *');
},error=>{
console.log('no container found !');
});
}
private _getTileContainer(): Observable <any> {
return Observable.timer(200).map(()=>{
const tileImages = $('#googlemap').find('img[src*=\'kml\']');
if (tileImages.length <= 2)
throw new Error("not enough tiles !");
return getContainer(tileImages);
})
.retry(30);
}
您的解决方案和@JonStødle的工作正常.但请注意,如果您无法获得任何容器,则不会收到通知.实际上,如果找不到容器,Observable就完成了,没有错误.
如果您想知道您无法找到容器,处理错误可能是件好事.
