Googleマップをイオン化して統合する

Question

私はVisual Studio '15でコードナビのタブテンプレートプロジェクトを実行しようとしています。私は単に私のタブmap.htmlにGoogleマップをロードしようとしているが、私は次のエラーを取得しています：ここ

TypeError: $scope.init is not a function 
at new <anonymous> (http://localhost:4400/js/controllers.js:22:12) 
at Object.instantiate (http://localhost:4400/lib/ionic/js/ionic.bundle.js:18010:14) 
at $controller (http://localhost:4400/lib/ionic/js/ionic.bundle.js:23412:28) 
at self.appendViewElement (http://localhost:4400/lib/ionic/js/ionic.bundle.js:59900:24) 
at Object.render (http://localhost:4400/lib/ionic/js/ionic.bundle.js:57893:41) 
at Object.init (http://localhost:4400/lib/ionic/js/ionic.bundle.js:57813:20) 
at self.render (http://localhost:4400/lib/ionic/js/ionic.bundle.js:59759:14) 
at self.register (http://localhost:4400/lib/ionic/js/ionic.bundle.js:59717:10) 
at updateView (http://localhost:4400/lib/ionic/js/ionic.bundle.js:65398:23) 
at http://localhost:4400/lib/ionic/js/ionic.bundle.js:65375:11 

は私のタブmap.htmlです：

<ion-view view-title="Map"> 

    <ion-content class="padding"> 
    <ion-refresher (ionRefresh)="doRefresh($event)"> 
     <ion-refresher-content 
      pullingIcon="arrow-dropdown" 
      pullingText="Pull to refresh" 
      refreshingSpinner="circles" 
      refreshingText="Refreshing..."> 
     </ion-refresher-content> 
    </ion-refresher> 

    <h2 align="center">Map</h2> 
    <div id="map" data-tap-disabled="true"></div> 
    </ion-content> 

    <ion-footer-bar class="bar-dark"> 
    <a ng-click="centerOnMe()" class="button button-icon icon ion-navigate">Find Me</a> 
    </ion-footer-bar> 

</ion-view> 

そして、私のcontroller.jsをこのコントローラは、JSファイルの真ん中にあるので、それの終わり

.controller('MapCtrl', function ($scope, $ionicLoading, $compile) { 

$scope.init() = function() { 
    console.log("Is this thing on?"); 
    var myLatlng = new google.maps.LatLng(35.182217, -83.381418); 

    var mapOptions = { 
     center: myLatlng, 
     zoom: 16, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 
    var map = new google.maps.Map(document.getElementById("map"), 
     mapOptions); 

    //Marker + infowindow + angularjs compiled ng-click 
    var contentString = "<div><a ng-click='clickTest()'>Click me!</a></div>"; 
    var compiled = $compile(contentString)($scope); 

    var infowindow = new google.maps.InfoWindow({ 
     content: compiled[0] 
    }); 

    var marker = new google.maps.Marker({ 
     position: myLatlng, 
     map: map, 
     title: 'Franklin, NC' 
    }); 

    google.maps.event.addListener(marker, 'click', function() { 
     infowindow.open(map, marker); 
    }); 

    $scope.map = map; 
} 
//google.maps.event.addDomListener(window, 'load', initialize); 

$scope.centerOnMe = function() { 
    if (!$scope.map) { 
     return; 
    } 

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

    navigator.geolocation.getCurrentPosition(function (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); 
    }); 
}; 

$scope.clickTest = function() { 
    alert('Example of infowindow with ng-click') 
}; 

}) 

Answer 1

として

下にあなたのinit関数を書くのセミコロンはありません

$scope.init = function() {} 

代わりの

$scope.init() = function() {} 

Answer 2

ので、私はNG-INIT = "は、init（）"

を追加したタブmap.htmlにVS 2015を経由してエミュレーションに表示するマップを取得することができましたモバイル上で実行しようとしたとき

<ion-content class="padding" ng-init="init()"> 

    <h2 align="center">Map</h2> 
    <div id="map" data-tap-disabled="true"></div> 
</ion-content> 

は今、私はこのエラーを取得する：次の行を指し

"ReferenceError: google is not defined 
at Scope.$scope.init (file:///android_asset/www/js/controllers.js:24:28) 
at fn (eval at compile (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:27638:15), <anonymous>:4:203) 
at Scope.$eval (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:30395:28) 
at pre (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:39095:15) 
at invokeLinkFn (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:22993:9) 
at nodeLinkFn (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:22371:11) 
at compositeLinkFn (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:21703:13) 
at nodeLinkFn (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:22387:24) 
at compositeLinkFn (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:21703:13) 
at publicLinkFn (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:21583:30)" 

：

var myLatlng = new google.maps.LatLng(35.182217, -83.381418);