Angular.js和谷歌地图

时间:2017-10-04 09:02:28

标签: angularjs google-maps-api-3

我正在使用angular.js使我的页面的选定部分可见。布局看起来像这样

+----------+
|navigation|
+----------+
|content   |
|          |
+----------+

当点击导航中的项目时,使用“ng-hide”指令可以看到不同的内容。在html中,页面如下所示:

<body ng-app="wfMap" ng-controller="appCtrl">
    <div class="wrapper">
        <div id="navigation">
            <div class="navItem" ng-click="show1()">1</div>
            <div class="navItem" ng-click="show2()">2</div>
        </div>

        <div id="content">
            <div id="content1" ng-hide="navIndex!=0" >
                <div id="map1"></div>
            </div>
            <div id="content2" ng-hide="navIndex!=1">
                <div id="map2"></div>
            </div>
        </div>
    </div>
</body>

导航包含两个按钮,这些按钮引用带有id map1和map2的div。最初显示map1,这可以按预期工作。但是当我点击nav2 map2时只显示部分。地图占用空间,并显示地图的放大/缩小和全屏按钮。只缺少地图数据本身。如果我全屏显示缺失的地图数据。如果我从全屏幕返回,地图看起来像预期的那样......有没有办法让map2正确显示?

0 个答案:

没有答案