javascript - ngRepeat + map.invalidateSize() 的 ng Leaflet 指令问题

Question

我有一个页面可以根据异步调用生成一系列 map 。 map 首次加载时，它们缺少图 block ，如下图所示。

我可以通过调用 map.invalidateSize() 重绘每个中的图 block 来解决这个问题。目前我在加载时创建了 8 个，其余的通过 Angular 指令分页。切换到任何其他 8 个或来回切换将“修复”前 8 个。

因为这前 8 个是 ngRepeat 的产物，所以它们都具有相同的 ID。理论上，我可以将索引或其他一些字符串修改添加到 8 个 map 中每个 map 的 ID，并创建以下代码的循环以在每个 map 上运行 map.invalidateSize()，但是这似乎是对这个问题的迂回和整体糟糕的解决方案。谁有更好的建议？

leafletData.getMap('leafletMap-trips').then(function(map) {
    setTimeout(function () { map.invalidateSize() });
});

Answer 1

事实上，不。传单 API 仅允许每个 map 的大小失效，因此您几乎需要按照您的解释进行操作。