传单没有互联网检测和通知

Question

例如，如果我的 wifi 离线，我在传单中看到新的地图区域是灰色的，但没有关于实际情况的通知。

如果我打开控制台，我会看到：

GET https://a.tiles.mapbox.com/v4/image.png?access_token=correct_token 
net::ERR_INTERNET_DISCONNECTED

有人知道捕获此类事件并显示自定义警告的方法吗？

我已经试过了：

$scope.$watch('tileerror', function (error, tile) {
    alert("No coonection");
});

p.s。使用 angular-传单指令

Answer 1

编辑：正如 Ghybs 在评论中指出的那样，确实有一个 tileerror 事件从 L.TileLayer 触发，但据我所知，它没有在 Angular Leaflet 中实现指令，如果我错了请纠正我。

L.TileLayer 确实有一个选项，用于在无法加载图块时设置替换图像，称为：errorTileUrl:

URL to the tile image to show in place of the tile that failed to load.

new L.TileLayer(URL, {
    errorTileUrl: 'error.png'
});

http://leafletjs.com/reference.html#tilelayer-errortileurl

如果您需要在图块加载失败时执行一些逻辑，您可以覆盖 L.TileLayer 的 _tileOnError 方法：

L.TileLayer.include({
    _tileOnError: function (done, tile, e) {

        // Do your stuff
        alert('whooops!');

        // Leaflet stuff
        var errorUrl = this.options.errorTileUrl;
        if (errorUrl) {
            tile.src = errorUrl;
        }
        done(e, tile);
    } 
});

https://github.com/Leaflet/Leaflet/blob/master/src/layer/tile/TileLayer.js#L96

传单没有互联网检测和通知

leaflet no internet detection and notification

angularjs

leaflet

mapbox