AngularJS を使用して Google マップの infoWindow を実装しようとしました。
私はテンプレートを持ってい<div>{{foo}}<br/>
ます$scope.foo="bar"
「{{foo}}」ではなく、値が「bar」の情報ウィンドウを表示したい。そのため、内容をコンパイルして設定しましたが、まだ運がありません。
これはGoogle Maps InfoWindow 内の AngularJS ng-includeと重複していると思われるかもしれませ ん。、しかし、コンテンツを動的にコンパイルしたい。
ここに私が今持っているコードがありますhttp://plnkr.co/edit/RLdAcaGz5FfmJEZi87ah?p=preview
angular.module('myApp', []).controller('MyCtrl', function($scope, $compile) {
var myLatlng = new google.maps.LatLng(-25.363882,131.044922);
var mapOptions = { zoom: 4, center: myLatlng };
var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
var infowindow = new google.maps.InfoWindow({position: myLatlng});
var x = "<div>{{foo}}<br/>{{foo}}";
$scope.foo="bar";
var el = $compile(x)($scope);
infowindow.setContent(el.html());
infowindow.open(map);
})
と思っ$scope.apply()
ていたのですが、コードで実行できませんでした。
Google マップの InfoWindow $compile
d を使用する方法はありますか?