書く方法<script> $スコープのスタイル

Question

私は私のイオンアプリにGoogleマップを実装しています。私はindex.htmlにマップが動作するようにする私のindex.htmlにスクリプトを持っています。

しかし、代わりにテンプレートファイルroute.htmlにマップが必要です。そのため、index.html内のスクリプトを特定のcontroller.jsファイルに移動する必要があると思いますが、ここのものは$ scopeスタイルで書かれていますどのように私は$スコープスタイルにスタイルを書いてもらえますか？

なぜ、同じコードが使用されているので実際にはroute.htmlで動作しませんか？ここで

<div id="map"></div> 

は私のindex.htmlに私のスクリプトです：

<script> 
    function initMap() { 
    var uluru = {lat: -25.363, lng: 131.044}; 
    var map = new google.maps.Map(document.getElementById('map'), { 
     zoom: 4, 
     center: uluru 
    }); 
    var marker = new google.maps.Marker({ 
     position: uluru, 
     map: map 
    }); 
    } 
</script> 
<script async defer 
src="https://maps.googleapis.com/maps/api/js?key=APIKEY&callback=initMap"> 
</script> 

そしてcontroller.jsの私のコントローラ

.controller('RouteCtrl', function($scope, $ionicLoading) { 
$scope.mapCreated = function(map) { 
$scope.map = map; 
}; 

$scope.centerOnMe = function() { 
console.log("Centering"); 
if (!$scope.map) { 
    return; 
} 

$scope.loading = $ionicLoading.show({ 
    content: 'Getting current location...', 
    showBackdrop: false 
}); 

navigator.geolocation.getCurrentPosition(function (pos) { 
    console.log('Got pos', pos); 
    $scope.map.setCenter(new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude)); 
    $scope.loading.hide(); 
}, function (error) { 
    alert('Unable to get location: ' + error.message); 
}); 
} 





}) 

Answer 1

あり、あなたの問題を解決するには2つの方法：

1. スクリプトを角度方式に変更する充填剤等のサービスの作成：=新しいgoogle.maps.Marker

   VARマーカー（{ マップ：$ scope.map、 アニメーション：google.maps.Animation.DROP、 位置：緯度経度 }）。

   var infoWindow =新しいgoogle.maps.InfoWindow（{ 内容：「ここにいる！」 }）;

   google.maps.event.addListener（マーカー、 'click'、function（）{ infoWindow.open（$ scope.map、marker）; }）;

2. コントローラでのjQueryに変更し、それを、それがイオンの角度の使用を目的に解除されますので、それはお勧めしません：

   VARマップ=新google.maps.Map（$（「＃マップ」）、 { ズーム：4, センター：uluru }）;