title: $state.go leads me to the otherwise statement and does not transition to the right state
body: <p>I am trying to move into the menu.home state but when I do <code>$state.go('menu.home)</code> it does not do anything and it goes into the otherwise statement.  Not sure what I am doing wrong.</p>
  
  <p><strong>Controller.js</strong></p>
  
  <pre><code>$state.go('menu.home');
  </code></pre>
  
  <p><strong>routes.js</strong></p>
  
  <pre><code>angular.module('app.routes', [])    
    .config(function($stateProvider, $urlRouterProvider) {
  
  
  
  // Ionic uses AngularUI Router which uses the concept of states
    // Learn more here: https://github.com/angular-ui/ui-router
    // Set up the various states which the app can be in.
    // Each state's controller can be found in controllers.js
    $stateProvider
  
    .state('login', {
       cache: false,
       url:'/login',
       templateUrl: 'templates/login.html',
       controller: 'LoginCtrl'
    })  
  
    .state('menu.home', {
       cache: false,
       url: '/home',
       views: {
         'side-menu21': {
           templateUrl: 'templates/home.html',
           controller: 'MapCtrl' //'homeCtrl'
         }
       }
    })
  
    .state('menu.cart', {
       url: '/page2',
       views: {
         'side-menu21': {
           templateUrl: 'templates/cart.html',
           controller: 'cartCtrl'
         }
       }
    })
  
    .state('menu.cloud', {
       url: '/page3',
       views: {
         'side-menu21': {
            templateUrl: 'templates/cloud.html',
            controller: 'cloudCtrl'
          }
       }
    })
  
    .state('menu.test', {
      cache: false,
      url: '/test',
      views: {
        'side-menu21': {
          templateUrl: 'templates/test.html',
          controller: 'testCtrl'
        }
      }
    })
  
    .state('menu', {
      url: '/side-menu21',
      templateUrl: 'templates/menu.html',
      abstract: true
    })
  
  //$urlRouterProvider.otherwise('/login')
  $urlRouterProvider.otherwise(function($injector, $location) {
    console.log("Could not find: " + JSON.stringify($location));
    $location.path('/login');
  })
  
  
  
  });
  </code></pre>
  
  <p>every time I try to do <code>$state.go('menu.home')</code> this is the output i get: </p>
  
  <pre><code> Could not find:     {"$$protocol":"http","$$host":"localhost","$$port":8100,"$$path":"/app/sear    ch","$$search":    {},"$$hash":"","$$url":"/app/search","$$absUrl":"http://localhost:8100/#/ap   p/search","$$state":null,"$$replace":false}
  </code></pre>
  
  <p><strong>login.html</strong></p>
  
  <pre><code>     &lt;ion-view view-title="Login" id="login" name="login-view"&gt;
         &lt;ion-content class="padding"&gt;
  
      &lt;!--##########################Facebook Login#################################--&gt;
      &lt;div class="facebookLogin"&gt;
      &lt;a class="facebook-sign-in button button-royal" ng-click="facebookSignIn()"&gt;Login with Facebook&lt;/a&gt;
      &lt;/div&gt;
      &lt;!--#######################END Facebook Login#################################--&gt;
  
            &lt;div class="list list-inset"&gt;
  
                &lt;label class="item item-input"&gt;
                    &lt;input type="text" placeholder="Username" ng-model="data.username"&gt;
                &lt;/label&gt;
  
                &lt;
  
      label class="item item-input"&gt;
                    &lt;input type="password" placeholder="Password" ng-model="data.password"&gt;
                &lt;/label&gt;
  
            &lt;/div&gt;
        &lt;button class="button button-block button-calm" ng-click="login()"&gt;Login&lt;/button&gt;
  
  
    &lt;/ion-content&gt;
  &lt;/ion-view&gt;
  </code></pre>
  
  <p>home.html</p>
  
  <pre><code>    &lt;ion-view title="Test" id="home" class=" "&gt;
  
      &lt;ion-content padding="true" class="has-header"&gt;&lt;/ion-content&gt;
  
  &lt;body ng-app="app" ng-controller="MapCtrl"&gt;
      &lt;!-- Google Maps --&gt;
      &lt;link href="css/style.css" rel="stylesheet"&gt;
      &lt;ion-content scroll="false"&gt;
          &lt;div id="map-canvas"&gt;&lt;/div&gt;
          &lt;!-- END GOOGLE MAPS!--&gt;
  
       &lt;!-- Test button 
      &lt;div class="TestButton"&gt;
      &lt;div class="button button-assertive" ng-click="Test()" ng-hide="hideTestButton"&gt;
        &lt;a class="button"&gt;Test&lt;/a&gt;
      &lt;/div&gt;
  
      &lt;/div&gt;
  
  
      End Request Test button-----------&gt;
  
  
  
  &lt;!-- OS/Production selection footer--&gt;
  
        &lt;ion-tabs class="tabs-icon-top"&gt;
        &lt;ion-tab title="Apple" icon-off="ion-social-apple" icon-on="ion-social-apple" href="#/app/search" on-select="appleTab()"&gt;
          &lt;ion-nav-view name="tab-search"&gt;&lt;/ion-nav-view&gt;
        &lt;/ion-tab&gt;
  
        &lt;ion-tab title="Windows" icon-off="ion-social-windows" icon-on="ion-social-windows" href="#/app/browse" on-select="windowsTab()"&gt;
          &lt;ion-nav-view name="tab-browse"&gt;&lt;/ion-nav-view&gt;
        &lt;/ion-tab&gt;
  
        &lt;ion-tab title="Mobile" icon-off="ion-iphone" icon-on="ion-iphone" href="#/app/playlists" on-select="mobileTab()"&gt;
          &lt;ion-nav-view name="tab-playlists"&gt;&lt;/ion-nav-view&gt;
        &lt;/ion-tab&gt;
        &lt;ion-tab title="Network" icon-off="ion-wifi" icon-on="ion-wifi"" href="#/app/playlists" on-select="otherTab()"&gt;
          &lt;ion-nav-view name="tab-playlists"&gt;&lt;/ion-nav-view&gt;
        &lt;/ion-tab&gt;
  
      &lt;/ion-tabs&gt;
  &lt;/ion-content&gt;
  &lt;/body&gt;
  &lt;/ion-view&gt;
  </code></pre>
  
  <p>If I comment out : <code>$location.path('/login');</code> then it works. Not sure why this happens, Please help!</p>