Angular JS與谷歌地圖支持+自動完成

我最近開始使用angularjs，我正在製作一個谷歌地圖的應用程序。我已經做了一個模塊，我打電話給一個地圖，我打電話給一個自動完成功能。自動完成工作，但地圖上沒有顯示Angular JS與谷歌地圖支持+自動完成

這是我模塊代碼

module.directive('googleplace', function() { 
    return { 
     require: 'ngModel', 
     replace: true, 
     link: function(scope, element, attrs, model) { 
      var options = { 
       types: [] 
      }; 
      var myOptions = { 
       zoom: 6, 
       center: new google.maps.LatLng(51.228388, 4.405518), 
       mapTypeId: google.maps.MapTypeId.ROADMAP 
      }; 
      scope.gPlace = new google.maps.places.Autocomplete(element[0], options); 

      google.maps.event.addListener(scope.gPlace, 'place_changed', function() { 
       scope.$apply(function() { 
        console.log(element.val()); 
        console.log(element); 
        model.$setViewValue(element.val());     
       }); 
      }); 
      var map = new google.maps.Map(document.getElementById(attrs.id), myOptions); 
      console.log(map); 
     } 
    }; 
});

獎勵： 此外，我希望把疊加使用從我的範圍數據我的地圖，我怎麼給該對象的模型值，然後把它放在谷歌地圖？

來源

2013-01-18 Wannes

我會建議的第一件事是創建一個小提琴，以便我們可以看到正在傳遞什麼樣的模型，控制器的外觀以及在這裏發生了什麼。

我正在嘗試最近做類似的事情，在我的情況下，問題是在模型可以加載之前觸發指令。這意味着Google地圖不會傳遞任何值，從而無法呈現地圖。

一種方法來解決它是由「看」的ngmodel，在這裏看到的更多信息：Angularjs passing object to directive

另一種方法是從你的控制器稱之爲「地圖」功能。

當然，你可以使用預建的指令太：http://nlaplante.github.com/angular-google-maps/#!/usage

編輯：爲疊加，你可以transclude並通過模型的指令範圍與所有需要的覆蓋數據。然後再次「觀察」這些模型，確保它們已加載，並且只需運行「地圖」功能並渲染出地圖即可。

來源

2013-02-18 18:51:22 winkerVSbecks

試試這個可能對你有幫助。

首先安裝鮑爾

- >涼亭安裝VS-谷歌，自動完成

添加谷歌地方圖書館腳本您的index.html

添加VS- google-autocomplete.js到你的index.html。

來源

2017-04-17 06:55:55

Angular JS與谷歌地圖支持+自動完成

回答

相關問題