問題加載谷歌地圖與角js

我正在使用以下JavaScript加載到我的angular.js web應用程序的谷歌地圖。當我在頁面上刷新時，地圖工作正常;但是，當我從應用程序的其他位置鏈接到該頁面時，地圖不會加載。我相信這與DOM監聽器沒有註冊'load'事件有關，但是，我不確定。我很感謝幫助解決這個問題。 DMullings的問題加載谷歌地圖與角js

authApp.controller('BarsController', function($scope, $rootScope, BarService) { 
    $scope.currentUser = Parse.User.current(); 
    $scope.title = $rootScope.title; 

    function initialize(){ 
     var mapOptions = { 
      zoom: 11, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 

     var map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions); 

     $scope.map = map; 
     if(navigator.geolocation) { 
      navigator.geolocation.getCurrentPosition(function(position) { 
       var pos = new google.maps.LatLng(position.coords.latitude, position.coords.longitude) 

       $scope.map.setCenter(pos); 

       //Set myLocation Pin 
       var marker = new google.maps.Marker({ 
        position: pos, 
        map: $scope.map, 
        title: 'My Location', 
        icon: 'http://maps.google.com/mapfiles/ms/icons/green-dot.png' 
       }); 

      }), function(error){ 
      console.log('Unable to get location: ' + error.message); 
      }; 
     } 
    }; 
    google.maps.event.addDomListener(window, 'load', initialize); 
});

解決方案提供：

authApp.controller('BarsController', function($scope, $rootScope, BarService) { 
    $scope.currentUser = Parse.User.current(); 
    $scope.title = $rootScope.title; 

    $scope.initialize = function(){ 
     var mapOptions = { 
      zoom: 11, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 

     var map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions); 

     $scope.map = map; 
     if(navigator.geolocation) { 
      navigator.geolocation.getCurrentPosition(function(position) { 
       var pos = new google.maps.LatLng(position.coords.latitude, position.coords.longitude) 

       $scope.map.setCenter(pos); 

       //Set myLocation Pin 
       var marker = new google.maps.Marker({ 
        position: pos, 
        map: $scope.map, 
        title: 'My Location', 
        icon: 'http://maps.google.com/mapfiles/ms/icons/green-dot.png' 
       }); 

      }), function(error){ 
      console.log('Unable to get location: ' + error.message); 
      }; 
     } 
    }; 
});

HTML：

<div data-ng-controller="BarsController" data-ng-init="initialize()"> 
    //HTML Content Here 
</div>

來源

2014-06-29 Jaskaye17

而不是試圖運行load事件的初始化函數，你可以嘗試使用ng-init

添加initialize功能Ë範圍：

$scope.initialize = function(){ 
    //code goes here 
};

然後調用初始化功能，當控制器由角

<div data-ng-controller="BarsController" data-ng-init="initialize()"></div>

初始化

來源

2014-06-29 17:16:12 dmullings

問題加載谷歌地圖與角js

回答

相關問題