所以我搜索和found a solution，我调整了一点，但我的问题是，它只会加载一个地图，而不是其他地图。

我的HTML看起来像这样：

<div id="mapParis" class="google-map" lat="48.833" long="2.333"></div>
<div id="mapWashington" class="google-map" lat="38.917" long="-77.000"></div>
<div id="mapTokyo" class="google-map" lat="35.667" long="139.750"></div>

和指令：

// Google Map
app.directive('googleMap',['$window','$q',function( $window,$q ) {
    function loadScript() {
        console.log('loadScript');

        // use global document since Angular's $document is weak
        var s = document.createElement('script');
        s.src = '//maps.googleapis.com/maps/api/js?sensor=false&language=en&callback=initMap';
        document.body.appendChild(s);
    }

    // Lazy loading of the script
    function lazyLoadApi(key) {
        console.log('lazyLoadApi');

        var deferred = $q.defer();

        $window.initMap = function () {
            deferred.resolve();
        };

        if ( $window.attachEvent ) {  
            $window.attachEvent('onload',loadScript); 
        } else {
            $window.addEventListener('load',loadScript,false);
        }

        return deferred.promise;
    }

    return {
        restrict: 'C',// restrict by class name
        scope: {
            mapId: '@id',// map ID
            lat: '@',// latitude
            long: '@'     // longitude
        },link: function($scope,elem,attrs) {
            // Check if latitude and longitude are specified
            if ( angular.isDefined($scope.lat) && angular.isDefined($scope.long) ) {
                console.log('-----');

                // Initialize the map
                $scope.initialize = function() {
                    console.log($scope.mapId);

                    $scope.location = new google.maps.LatLng($scope.lat,$scope.long);

                    $scope.mapOptions = {
                        zoom: 6,center: $scope.location
                    };

                    $scope.map = new google.maps.Map(document.getElementById($scope.mapId),$scope.mapOptions);

                    new google.maps.Marker({
                        position: $scope.location,map: $scope.map,});
                }

                // Check if google map API is ready to run
                if ( $window.google && $window.google.maps ) {
                    console.log('gmaps already loaded');

                    // Google map already loaded
                    $scope.initialize();
                } else {
                    lazyLoadApi().then(function () {
                        // Promised resolved
                        console.log('promise resolved');

                        if ( $window.google && $window.google.maps ) {
                            // Google map loaded
                            console.log('gmaps loaded');

                            $scope.initialize();
                        } else {
                            // Google map NOT loaded
                            console.log('gmaps not loaded');
                        }
                    },function () {
                        // Promise rejected
                        console.log('promise rejected');
                    });
                }
            }
        }
    };

这是一个带有3个地图的jsFiddle，你会看到只有最后一个被加载：http://jsfiddle.net/5Pk8f/1/

我想我做的事情我的范围或承诺的方式有问题，但我现在是很出于意见的想法…

谢谢！ (对不起，我不是那么好的英文)

更新(回答后)

作为更新，
这里是我想出的完整解决方案：
http://jsfiddle.net/5Pk8f/5/

Google地图服务

// Lazy loading of Google Map API
app.service('loadGoogleMapAPI',function ( $window,$q ) {

        var deferred = $q.defer();

        // Load Google map API script
        function loadScript() {  
            // Use global document since Angular's $document is weak
            var script = document.createElement('script');
            script.src = '//maps.googleapis.com/maps/api/js?sensor=false&language=en&callback=initMap';

            document.body.appendChild(script);
        }

        // Script loaded callback,send resolve
        $window.initMap = function () {
            deferred.resolve();
        }

        loadScript();

        return deferred.promise;
    }]);

Google地图指令

// Google Map
app.directive('googleMap',['$rootScope','loadGoogleMapAPI',function( $rootScope,loadGoogleMapAPI ) {  

        return {
            restrict: 'C',// restrict by class name
            scope: {
                mapId: '@id',// map ID
                lat: '@',// latitude
                long: '@'     // longitude
            },link: function( $scope,attrs ) {

                // Check if latitude and longitude are specified
                if ( angular.isDefined($scope.lat) && angular.isDefined($scope.long) ) {

                    // Initialize the map
                    $scope.initialize = function() {                                        
                        $scope.location = new google.maps.LatLng($scope.lat,$scope.long);

                        $scope.mapOptions = {
                            zoom: 12,center: $scope.location
                        };

                        $scope.map = new google.maps.Map(document.getElementById($scope.mapId),$scope.mapOptions);

                        new google.maps.Marker({
                            position: $scope.location,});
                    }

                    // Loads google map script
                    loadGoogleMapAPI.then(function () {
                        // Promised resolved
                        $scope.initialize();
                    },function () {
                        // Promise rejected
                    });
                }
            }
        };
    }]);

HTML使用示例

<div id="mapParis" class="google-map" lat="48.833" long="2.333"></div>
<div id="mapWashington" class="google-map" lat="38.917" long="-77.000"></div>
<div id="mapTokyo" class="google-map" lat="35.667" long="139.750"></div>

再次感谢Maurycy