Nested states on Android


#1

Hello
I just finished my app and it works completely fine on the browser; now I want to test it on an Android device but I noticed some issues with nested view. Here’s my route configuration:

$stateProvider
      .state('app', {
        abstract: true,
        templateUrl: 'templates/main.html',
        controller: 'MainController'
      })
      .state('login', {
        parent: 'app',
        url: '/login',
        templateUrl: 'templates/views/login.html',
        controller: 'LoginController'
      })
      .state('app.utente', {
        abstract:true,
        template: '<ui-view/>',
        resolve: {
          prestazioni: function(PrestazioniService){
            return PrestazioniService.lista();
          },
          notifiche: function(NotificheService){
            return NotificheService.perUtente();
          },
          isJobber: function() { return false;}
        }
      })
      .state('app.utente.home', {
        url: '/utente/home',
        templateUrl: 'templates/views/utente/home.html',
        controller: 'UtenteController'
      })
      .state('app.utente.prestazione', {
        url: '/utente/prestazione/',
        params: { prestazione: null, user: null, jobber: null },
        templateUrl: 'templates/views/utente/prestazione.html',
        controller: 'PrestazioneController'
      })

Login screen is shown correctly but when I navigate to app.utente I can only see header and side menu. If I replace (just for testing purpose) the template of the abstract state with the template url of app.utente.home I can see the template; so template urls are ok and I see no js error on console. I would expect to see home.html in the ui-view but that’s not happening; is there any known reason this does not work on Android?

Views for login (working) and utente.home (not working):

<ion-view  align-title="left">
    <ion-content>
    </ion-content>
</ion-view>

Main view:

<ion-side-menus>
    <!-- Center content -->
    <ion-side-menu-content>

      <ion-nav-bar >
      </ion-nav-bar>

      <ion-nav-view animation="slide-left-right"></ion-nav-view>

    </ion-side-menu-content>

    <!-- Left menu -->
    <ion-side-menu side="left" class="sideMenu" >

        <ion-header-bar align-title="center" class="grayBg">
        </ion-header-bar>

        <ion-content class="has-header">
          <ion-list>
            <ion-item ng-click="logout()" ui-sref-active="active"  menu-toggle>
              <i class="icon ion-log-out"></i>
              Logout
            </ion-item>
          </ion-list>
        </ion-content>
    </ion-side-menu>
</ion-side-menus>