Ui-router nested view with Phonegap issue

ionic-v1
1

Having difficulty to figure out why the controller does not get called in actual iOS device when routed to different nested template (favorite.html). It works totally fine in the browser and the iOS simulator, but not in actual device when directly loaded.

//app.js
.config(function($stateProvider, $urlRouterProvider) {
   $stateProvider

   .state('menu', {
     abstract: true,
     url: "/menu",
     templateUrl: "templates/menu.html",
     controller: "MenuCtrl"
   })

   .state('menu.wordlist',{
     url: "/wordlist",
     views:{
     "content-words":{
       templateUrl: "templates/wordlist.html",
       controller: "WordlistCtrl"
      }
     }
   })

  .state('menu.favorite',{
    url: "/favorite",
    views:{
    "content-words":{
      templateUrl: "templates/favorite.html",
      controller: "FavoritesCtrl"
     }
   }
  });

 // if none of the above states are matched, use this as the fallback
 $urlRouterProvider.otherwise('/menu/wordlist');
});

The html:

<ion-side-menus >

  <!-- Center content -->
  <ion-side-menu-content>
    <ion-header-bar class="bar-positive">
    </ion-header-bar>
       
      //nested templates
      <ion-nav-view name="content-words"></ion-nav-view>

  </ion-side-menu-content>

  <!-- Left menu content list -->
  <ion-side-menu expose-aside-when="large">
    <ion-header-bar class="bar-calm">
    </ion-header-bar>

    <ion-content class="side_menu-bg" ng-click="toggleLeft()">
      <ion-list  ui-sref="menu.favorite">
        <ion-item nav-clear menu-close class="item-menu" >
          //loads favorite.html
          Favorites
        </ion-item>
      </ion-list>
     
       //load wordlist.html
      <ion-list ng-repeat="word in wordlist" ui-sref="menu.wordlist" >
        <ion-item nav-clear menu-close class="tem-menu">
          {{word }}
        </ion-item>
      </ion-list>
    </ion-content>
  </ion-side-menu>

This works without any error in the browsers and even in iOS simulator, but when I load in the actual iOS devices through Xcode, and when “Favorites” is clicked from the menu list, only the template gets loaded, but the data from the controller does not load at all. It doesn’t log anything in the console from “FavoritesCtrl”, but it does logs everything when running through the simulator. The “wordlist.html” and “WordlistCtrl” loads fine everywhere as it’s supposed to.

Don’t know what exactly how to figure this unusual situation. Any suggestions would be greatly appreciated.

Thank you.

2

Im having a simiilar issue with nested states. I’m going to take a look this weekend and see if I can tackle it and let you know.

I have a state, stateA that just has a ion-nav-view as a template and is abstract. Then a stateA.stateB and stateA.stateC and even further nested states…

works on broswer, even works on ios simulator with the live reload ionic feature, but without the live reload, I click and nothing happens.

I’ll update you if I figure it out!

3

Spoke too soon!! It had to do with the template url path…

not sure why, but my template url for the state that didnt work was prefixed with '…/templates/stateA.html… the relative path wasnt being found on the device so i changed it like the other states were, which started with templates/

Double check your template URLs?

4

Mine is exactly like I’ve posted above. Both the nested templates have the same route url. Still not sure why it does that. :frowning: