Ionic "Can not ready property 'ready' of undefined property


Hey guys,

I’m developing an app where I’m using Firebase as backend. Before I added Firebase to my app, everything was working fine but now, when I try to use the app I get the error:

ionic.bundle.min.js:150 TypeError: Cannot read property 'ready' of undefined
    at new <anonymous> (controllers.js:98)
    at Object.invoke (ionic.bundle.min.js:75)
    at S.instance (ionic.bundle.min.js:122)
    at n (ionic.bundle.min.js:98)
    at g (ionic.bundle.min.js:92)
    at n (ionic.bundle.min.js:99)
    at g (ionic.bundle.min.js:92)
    at ionic.bundle.min.js:91
    at Object.x.appendViewElement (ionic.bundle.min.js:471)
    at Object.render (ionic.bundle.min.js:470)(anonymous function) @ ionic.bundle.min.js:150(anonymous function) @ `ionic.bundle.min.js:123$broadcast @ ionic.bundle.min.js:179x.transition.I.then.x.transition.x.transition @ ionic.bundle.min.js:447(anonymous function) @ ionic.bundle.min.js:162$eval @ ionic.bundle.min.js:176$digest @ ionic.bundle.min.js:174$apply @ ionic.bundle.min.js:177(anonymous function) @ ionic.bundle.min.js:190e @ ionic.bundle.min.js:79(anonymous function) @ ionic.bundle.min.js:82`

My app.js looks like this:

var mapApp = angular.module('mapApp', ['ionic',])

.run(function($ionicPlatform) {
  $ionicPlatform.ready(function() {
    if(window.StatusBar) {

mapApp.config(function($stateProvider, $urlRouterProvider) {
  .state("home", {
    url: "/",
    templateUrl: "templates/home.html"

  .state("search", {
    url: "/search",
    templateUrl: "templates/search.html"
  .state("map", {
    url: "/map",
    templateUrl: "templates/map.html"


The relevant part of my controller.js looks like this:

//Funktion zur Initialisierung der Map
//inklusive Geocoding und Erreichbarkeitspolygonen
function initialize() {
      //Route360° config
      r360.config.serviceKey = 'xcv';
      r360.config.serviceUrl = '';

 	  //Karte und Geocoder initialisieren
      var myLatlng = new google.maps.LatLng(48.383, 10.883);
      var mapOptions = {
        center: myLatlng,
        zoom: 8,
        mapTypeId: google.maps.MapTypeId.ROADMAP
      var map = new google.maps.Map(document.getElementById("map"), mapOptions);
      var geocoder = new google.maps.Geocoder();

      //Abrufen des ersten Services um eine synchrone Abfolge von
      //Geocoding -> schreiben in Service -> abrufen aus Service herzustellen
      var p = geocodeAddress(geocoder,map);

      p.then(function() {
      //Route 360° Polygon erzeugen
      var coords = dataService.getLatLng();
      var time = dataService.getTime();
      var move = dataService.getMove();
      var colorPolygonLayer = new GoogleMapsPolygonLayer(map);
      showPolygons(coords[0], coords[1],colorPolygonLayer, time, move);

      //POIs aus Firebase laden und in array data[] speichern
      var data = new Array;
      var query = firebase.database().ref("users").orderByKey();
      	.then(function(snapshot) {
      		snapshot.forEach(function(childSnapshot) {
      			var poi = childSnapshot.val();
      			if(poi.stadt == dataService.getStadt()){

      $ = map;

And my index.html like this:

<html ng-app="mapApp">
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <meta http-equiv="Content-Security-Policy" content="default-src *; script-src 'self' 'unsafe-inline' 'unsafe-eval' *; style-src  'self' 'unsafe-inline' *">

     <!-- stylesheets -->
    <link href="" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">
    <link rel="stylesheet" href="" />

    <!--  Include jQuery and jQuery UI -->
    <script src=""></script>
    <script src=""></script>

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

    <!-- Including Google Maps API -->
    <script src=""></script>

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

    <!-- Firebase -->
    <script src=""></script>
      var config = {
       apiKey: "abc",
       authDomain: "",
       databaseURL: "",
       storageBucket: "",
       messagingSenderId: "",
    <!-- your app's js -->
    <script src="js/app.js"></script>
    <script src="js/controllers.js"></script>
    <script src="js/directives.js"></script>

    <!--  Include r360.js -->
    <script src=""></script>
    <script src=""></script>

I dont know what I did wrong here but I think I did something wrong with the dependencies / includes since it worked before. Removing the firebase include + code does not solve my issue so I appreciate every kind of hint.

Thanks for any help in advance,



Found the problem…

It seems that I accidently changed




Thanks anyway and best regards,