谷歌地圖沒有顯示在離子框架上

我是一個初學者在離子和搞亂谷歌地圖。我想在屏幕上顯示谷歌地圖，但它沒有出現在屏幕上，儘管我認爲<div>正在接收代碼。幫幫我！！谷歌地圖沒有顯示在離子框架上

守則<body>

<body ng-controller="RoadwayControl"> 

<ion-side-menus> 

    <!-- Centre Part --> 
    <ion-side-menu-content> 
    <ion-header-bar class="bar-dark"> 
     <button class="button button-icon" ng-click="leftMenuClick()"> 
     <i class="icon ion-navicon"></i> 
     </button> 
     <h1 class="title">Roadway Maps</h1> 
     <button class="button button-icon" ng-click="rightMenuClick()"> 
     <i class="icon ion-navicon"></i> 
     </button> 
    </ion-header-bar> 

     <ion-content ng-controller="GoogleMapsControl"> 
     <div id="map" data-tap-disabled="true"></div> 
     </ion-content> 

    </ion-side-menu-content> 


</ion-side-menus> 

    <!-- Needed for Cordova/PhoneGap (will be a 404 during development) --> 
    <script src="http://maps.googleapis.com/maps/api/js?key=AIzaSyAt18I1Nft28M_AaxJjo6kGI-lcP2o5STk&sensor=true"></script> 
    <script src="js/app.js"></script> 
    <script src="cordova.js"></script> 
    </body>

守則js/app.js

var roadwayApp=angular.module("roadwayNepal",['ionic']) 


roadwayApp.factory("RoadwayClass",function(){ 
    return{ 
    routes: [], 
    }; 
}); 


roadwayApp.factory("GoogleMaps",function(){ 
    return{ 

    }; 
}); 

roadwayApp.controller("RoadwayControl",function($scope,$ionicSideMenuDelegate){ 
    $scope.allMenus= [ 
     {"title":"About"}, 
     {"title":"Settings"}, 
    ]; 

    $scope.leftMenuClick=function(){ 
    $ionicSideMenuDelegate.toggleLeft(); 
    }; 


    $scope.activeMenu=null; 

    $scope.rightMenuClick=function(){ 
    if(RoadwayClass.routes.length>0){ 
     //there are routes 
     $ionicSideMenuDelegate.toggleRight(); 
    }else{ 
     console.log("empty list"); 
    } 
    } 


}); 


roadwayApp.controller("GoogleMapsControl",function($scope,$ionicLoading){ 
    google.maps.event.addDomListener(window, 'load', function() { 
     var myLatlng = new google.maps.LatLng(37.3000, -120.4833); 

     var mapOptions = { 
      center: myLatlng, 
      zoom: 16, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 

     var myDiv=document.getElementById("map"); 
     var map = new google.maps.Map(myDiv, mapOptions); 

     // navigator.geolocation.getCurrentPosition(function(pos) { 
     //  map.setCenter(new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude)); 
     //  var myLocation = new google.maps.Marker({ 
     //   position: new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude), 
     //   map: map, 
     //   title: "My Location" 
     //  }); 
     // }); 
     $scope.map = map; 
    }); 
});

來源

2015-05-08 Damodar Dahal