Question

我正在尝试在局部视图中使用ng-map库。它在页面的初始设置上工作正常（即，首次创建局部视图时）。

但是，如果我导航到不同的局部视图（例如，通过点击我放在地图上的标记）然后按下浏览器后退按钮，事情就会崩溃。

地图对象似乎存在于$ scope中，但它并没有“连接”到元素。因此，例如，调用$ scope.map.getBounds（）会导致返回null值。

如果在传入mapInitialized事件处理程序的地图变量上调用getBounds（），情况也是如此。

消除对getBounds（）的调用 - 我用它来提取信息以创建标记 - 消除了未定义的值错误。但地图本身从未初始化。视口只是一个大的灰色矩形。我认为这进一步证明，在重新创建局部视图时，地图html元素不会被“连接”到库代码。

app.controller("mapCtrl", function ($scope, $location, dataContext) {
    $scope.markers = [];

    // these bind to attributes of the map element in my html
    $scope.pins = function() { return dataContext.pins(); }
    $scope.center = dataContext.center();
    $scope.zoom = function() { return dataContext.zoom() };

    $scope.$on('mapInitialized', function(evt, map){
        // this stores changes to the center of the map
        // so I can recreate it when the partial view is recreated
        $scope.dragend = function() {
            dataContext.center(map.getCenter());

            dataContext.get(map.getBounds());
        }

        // this stores changes to the map's zoom level
        // so I can recreate it when the partial view is recreated
        $scope.zoomchanged = function() {
            dataContext.center(map.getZoom());

            dataContext.get(map.getBounds());
        }

        // this is where I noticed the problem -- when
        // the partial view is initially created bounds is
        // defined and my marker creation routine works fine.
        // but when the view is recreated upon navigating back
        // to the partial view, bounds is undefined, and the
        // map never displays
        var bounds = map.getBounds();
        if( bounds != null ) dataContext.get(map.getBounds());
    });

    // this is the marker click handler, which takes us to a
    // different partial view
    $scope.click = function() {
        dataContext.pin(this.pinindex);

        if( dataContext.pin().Homes.length == 1)
        {
            dataContext.home(0);
            $location.path("/home");
        }
        else $location.path("/unit");
    };
});

单步执行Map指令初始化

当首次执行map指令时（即，在初始页面加载时），从angular传递给初始化的attrs对象包含有效的中心和缩放。

但是当指令随后在返回页面时初始化时（即，重新创建局部视图时），只能正确定义缩放。中心是“，”，这是毫无意义的。

我不确定为什么第二次忽略中心属性值，但这似乎是问题的根源。不幸的是，attrs被设置在角度库中，我没有时间去探索。希望这会有所帮助。

ng-map：在部分视图中初始化地图

0 个答案: