javascript - AngularJS：在选项卡中通过 Google Maps API v3 进行地图

Question

我正在尝试创建一个带有标签的页面（使用 AngularJS）。其中一个选项卡中有一张地图（Google Maps API v3）。当地图位于前景选项卡中时，一切似乎都正常。但是，当地图加载到后台选项卡中并且仅在单击选项卡后才可见时，地图会错位/切断，当您尝试使用它进行操作时，它的功能似乎被破坏了。

我已经搜索了解决方案，我发现了这些技巧

google.maps.event.trigger(map, 'resize');
map.setCenter(center);

但它不起作用。您能否看看http://jsfiddle.net/n4q7Y/5/并告诉我我错过了什么？

谢谢你。

Answer 1

resize在触发-event之前稍等片刻：http: //jsfiddle.net/doktormolle/aAeZw/

Answer 2

谢谢你 Dr.Molle，如果我能改进一点，在我的情况下，一个 $timeout 可以完美地完成工作（因为它会等到 $digest 周期结束）

$timeout(function () {
    // in my case
    initializeMap();
    // OR this case:
    google.maps.event.trigger(map, 'resize');                      
}, 1000); // with or without delay