I’m a newbie when it comes to using Ionic, so this may be a simple fix. The ionic framework loads just fine, but the content in the view is not showing. I’m using Google Maps for AngularJS (link) and followed the instructions to the letter.
Here is my tab content:
<ion-view title="Maps">
<ion-content class="has-header">
<h2>Map</h2>
<google-map center="map.center" zoom="map.zoom"></google-map>
</ion-content>
</ion-view>
Here is the content of index.html
<!DOCTYPE html>
<link href="css/app.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>
<!-- 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/services.js'></script>
<script src='//maps.googleapis.com/maps/api/js?sensor=false'></script>
<script src='js/underscore/underscore.js'></script>
<script src='js/angular-google-maps/dist/angular-google-maps.min.js'></script>
<script src='js/index.js'></script>
And here is the content of my index.js file, which contains the code for the module:
var map = angular.module('myApplicationModule', ['google-maps']);
$scope.map = {
center: {
latitude: 45,
longitude: -73
},
zoom: 8
};
Any help would be appreciated!