離子sidemenu崩潰地圖

我一直嘗試一遍一遍地積極運行與地圖sidemenu，但它的屏幕不斷變成白色。我需要有人告訴我它到底有什麼問題。我如何解決它？離子sidemenu崩潰地圖

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width"> 
    <title></title> 

    <link href="lib/ionic/css/ionic.css" rel="stylesheet"> 
    <link href="css/style.css" rel="stylesheet"> 

    <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above 
    <link href="css/ionic.app.css" rel="stylesheet"> 
    --> 

    <!-- ionic/angularjs js --> 
    <script src="lib/ionic/js/ionic.bundle.js"></script> 

    <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAs27t8rz7neJCwe6xNdWTPLMr5QmR-8Cg"></script> 

    <!-- cordova script (this will be a 404 during development) --> 
    <script src="cordova.js"></script> 

    <!-- your app's js --> 
    <script src="js/app.js"></script> 
    <script src="js/controllers.js"></script> 
    <script src="js/directives.js"></script> 
    </head> 



    <body ng-app="starter" ng-controller="MapCtrl"> 
    <ion-header-bar class="bar-calm"> 
     <button class="button button-icon icon ion-navicon" ng-click = "toggleLeft()"></button> 
     <h1 class="title">Map</h1> 
     <button class="button button-clear button-positive">Edit</button> 
    </ion-header-bar> 
    <!--trabajando con el sidemenu--> 
    <ion-side-menu> 
     <ion-side-menu-content> 
      <ion-side-menu side="left"> 
       <ion-list> 
        <ion-item>HOME</ion-item> 
       </ion-list> 
       <ion-list> 
        <ion-item>BRYAN</ion-item> 
       </ion-list> 
       <ion-list> 
        <ion-item>KORA</ion-item> 
       </ion-list> 

      </ion-side-menu> 
     </ion-side-menu-content> 
    </ion-side-menu> 
    <ion-content scroll="false"> 
     <map on-create="mapCreated(map)" ng-init="initMap()"></map> 
    </ion-content> 

    <ion-footer-bar class="bar-calm"> 
     <a ng-click="centerOnMe()" class="button button-icon icon ion-navigate"></a> 
    </ion-footer-bar> 
    </body> 
</html>

這是controller.js

angular.module('starter.controllers', []) 

.controller('MapCtrl', function($scope, $ionicLoading, $ionicSideMenuDelegate) { 
    $scope.left = function() { 
    $ionicSideMenuDelegate.left(); 
    } 
    $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); 
    }); 
    }; 
}); 

// 
.controller('MapCtrl', function($scope, $ionicSideMenuDelegate){ 
    $scope.toggleLeft = function(){ 
    $ionicSideMenuDelegate.toggleLeft() 
    } 
})

來源

2016-08-25 Bryan Torres

其他文章不幫助！ –

控制檯中是否有錯誤？ – Anuj

我終於找到了解決辦法。問題是谷歌地圖穩定版插件無法正常工作。

嘗試中，而不是命令行這一個：

科爾多瓦插件添加https://github.com/phonegap-googlemaps-plugin/cordova-plugin-googlemaps --variable API_KEY_FOR_ANDROID = 「YOUR_ANDROID_API_KEY_IS_HERE」 --variable API_KEY_FOR_IOS = 「YOUR_IOS_API_KEY_IS_HERE」

另外，還要確保你籤兩個.apk文件在android和ios中爲了簽署代碼，請輸入終端--codeSignIdentity，以便在兩個設備中正確顯示地圖。

來源

2016-09-18 23:02:40

離子sidemenu崩潰地圖

回答

相關問題