0

我正在我的应用程序中使用Google-maps-angular指令，我正在尝试将该指令包装在我自己的指令中。如果我在控制器中定义地图对象，它工作正常。但是当我在链接函数中定义地图对象时，它似乎并没有得到地图对象。

我尝试在指令的控制器中定义地图对象，但这也没有加载地图。在加载 html 之前似乎没有初始化范围，这解释了为什么地图不会加载，但我无法弄清楚为什么会这样。有没有其他方法可以在指令内部而不是外部控制器中定义地图对象？

此外，当查看 google-map 的范围内时（使用 angular.element("google-map >").scope() ），它显示要定义的中心，所以我不确定为什么没有加载地图。

var app = angular.module('myApp',[
        'google-maps',
    ])

app.directive('myDir', function($http) {
    return {
        restrict: 'AE',
        template: '<google-map center="map.center" zoom="13" draggable="true" pan= "1" control="map.control"></google-map>',
        link: function(scope, elem, attrs) {
            scope.map = {
                center: {
                    latitude: 40.35,
                    longitude: -74.6702
                },
                control:{}
            }
        },
    };
});
4

1 回答 1

1

我知道您不是在询问ngMap，但我发现这种方式比http://angular-google-maps.org/容易得多

这是 plunker，http ://plnkr.co/edit/ZwUARi7OC2vUnJS6UdBD?p=preview

这是你的指令

var app = angular.module('myApp', ['ngMap']);

app.directive('myDir', function() {
  return {
    restrict: 'AE',
    template: '<map center="{{mapOptions.center}}" zoom="13" draggable="true" pan="1"></map>',
    link: function(scope, elem, attrs) {
    },
  };
});

它不应该那么难。顺便说一句，我是ngMap的创建者

于 2014-06-16T21:16:34.003 回答