AngularJS，Google Maps和InfoWindows

我試圖打開一個信息窗口，當用戶點擊地圖上的一個標記或者當用戶從一個位置列表中點擊一個位置。我遇到的問題是我收到一個$ apply已經在進行中的錯誤。該應用程序仍然正常工作，但根據文檔，如果我看到這個錯誤，我做錯了什麼。以下是我正在處理的兩段代碼。AngularJS，Google Maps和InfoWindows

第一個函數將標記放置在地圖上並響應點擊標記點擊事件。

var placeMarker = function(center) { 
      var marker = new google.maps.Marker({ 
       map : map, 
       position : new google.maps.LatLng(center.location.latitude, center.location.longitude) 
      }); 

      var infoWindow = new google.maps.InfoWindow(); 

      marker.center = center; 
      $scope.markers.push(marker); 

      google.maps.event.addListener(marker, "click", function() { 
       if ($scope.openInfoWindow) { 
        $scope.openInfoWindow.close(); 
       } 

       $scope.center = marker.center; 

       if (!$scope.compiled) { 
        var content = '<div id="infowindow_content" ng-include src="\'/infowindow.html\'"></div>'; 
        $scope.compiled = $compile(content)($scope); 
       } 

       $scope.$apply(); 

       infoWindow.setContent($scope.compiled[0].innerHTML); 
       infoWindow.open(map, marker); 

       $scope.openInfoWindow = infoWindow; 
      }); 
};

這裏的第二個功能就是接受來自應用程序中的其他地方的事件，併發送一個谷歌地圖點擊事件，我想開了標記。

$scope.$on("app:ResultListSelection", function(event, providerNumber) { 
      for (var i = 0, length = $scope.markers.length; i < length; i += 1) { 
       var center = $scope.markers[i].center; 

       if (providerNumber === center.providerNo) { 
        google.maps.event.trigger($scope.markers[i], "click"); 
        break; 
       } 
      } 
     });

當我觸發標記上的谷歌地圖點擊事件時，應用程序已經進行中的錯誤發生。

有沒有人知道我可能會做錯什麼？

來源

2013-01-23 Kyle Buchanan

你是如何調用函數placeMarker？如果你註釋掉你的'$ scope。$ apply（）'行，錯誤消失了，你的應用程序還能工作嗎？當你調用Angular的$ apply（）「inside」時會發生這個錯誤。換句話說，Angular已經在[$ digest循環]（http://docs.angularjs.org/guide/concepts）中了 - 請參閱「運行時」部分的圖片。所以Angular已經在$ apply中。 –

當我從$ rootScope接收到一個事件時，會調用placeMarker，該事件傳遞我需要在地圖上放置標記的所有信息。如果我註釋$ scope。$ apply（），我沒有收到錯誤，但是我的infoWindow沒有顯示。我會看看「運行時」中的圖片，看看是否爲我清理了一些東西。 –

我知道有可能是一個更好的方式來做到這一點，但我最終加入underscore.js到我的項目並使用下劃線編譯模板同時傳遞數據的採集。

var template = _.template($("#infoWindowTmpl").html()), 
    compiled = template($scope); 

var infoWindow = new google.maps.InfoWindow({ 
    content : compiled 
});

來源

2013-01-29 16:44:48

AngularJS，Google Maps和InfoWindows

回答

相關問題