Javascript AngularJS谷歌地图指令

Javascript AngularJS谷歌地图指令,javascript,angularjs,google-maps,angularjs-directive,Javascript,Angularjs,Google Maps,Angularjs Directive,我试图创建一个角度指令来显示谷歌地图 这是我的指示: 'use strict'; var CartoBundle = angular.module('CartoBundle', []); CartoBundle.directive('cartoBundleMap', function() { var map; return { restrict: 'EA', replace: true, template: '<section id="map"><

我试图创建一个角度指令来显示谷歌地图

这是我的指示:

'use strict';

var CartoBundle = angular.module('CartoBundle', []);

CartoBundle.directive('cartoBundleMap', function() {

var map;

return {
    restrict: 'EA',
    replace: true,
    template: '<section id="map"></section>',
    scope: {
        zoom: "@",
        zoomControl: "=",
        fullScreenControl: "=",
        mapTypeControl: "=",
        scaleControl: "=",
        streetViewControl: "=",
        mapTypeId: "@"
    },
    link: function(scope, element, attrs) {

        var options = {
            center: new google.maps.LatLng(46.52863469527167,2.43896484375),
            zoom: 6,
            zoomControl : true,
            fullscreenControl : true,
            mapTypeControl: true,
            scaleControl: true,
            streetViewControl: true,
            mapTypeId: "hybrid"
        };

        if (scope.zoom) options.zoom = scope.zoom * 1;
        if (scope.zoomControl) options.zoomControl = scope.zoomControl;
        if (scope.fullScreenControl) options.fullScreenControl = scope.fullScreenControl;
        if (scope.mapTypeControl) options.mapTypeControl = scope.mapTypeControl;
        if (scope.scaleControl) options.scaleControl = scope.scaleControl;
        if (scope.streetViewControl) options.streetViewControl = scope.streetViewControl;
        if (scope.mapTypeId) options.mapTypeId = scope.mapTypeId;

        map = new google.maps.Map(element[0], options);
    },
};
});
有人能帮我吗?我是angularjs的初学者


关于

好的,我找到了它不起作用的原因

这是因为如果scope.attribute等于false,它将永远不会验证if条件

我修改代码如下:

if (!angular.isUndefined(scope.zoom)) options.zoom = scope.zoom * 1;
希望这能对以后的人有所帮助


关于

好的,我找到了它不起作用的原因

这是因为如果scope.attribute等于false,它将永远不会验证if条件

我修改代码如下:

if (!angular.isUndefined(scope.zoom)) options.zoom = scope.zoom * 1;
希望这能对以后的人有所帮助


关于

有很多库可供您在Angular应用程序中使用谷歌地图(如:)。有很多库可供您在Angular应用程序中使用谷歌地图(如:)。
<carto-bundle-map 
    zoom-control="false"
    full-screen-control="false"
    map-type-control="false"
    scale-control="false"
    street-view-control="false"
    map-type-id="satellite"
></carto-bundle-map>
scope: {
    zoom: "@",
    zoomControl: "=",
    fullScreenControl: "=",
    mapTypeControl: "=",
    scaleControl: "=",
    streetViewControl: "=",
    mapTypeId: "@"
},
if (!angular.isUndefined(scope.zoom)) options.zoom = scope.zoom * 1;