Can someone please give a codepen example or something showing how to uses hierarchical states (HS)? I can make HS such as “find” and “find.search”, but if I leave out the “app” top-level state in the sidemenu example, then I won’t have the menu system. If I try to make substates from app, as in app.find.search, I just get white-screen with no errors: .state('app', { url: "/app", abstract: true, templateUrl: "templates/menu.html", controller: 'AppCtrl' }) .state('find', { url: "/find", views: { 'menuContent': { template: "find template" } } }) .state('find.search', { url: "/find/search", // I've also tried just /search here views: { 'menuContent': { templateUrl: "templates/search.html" } } }) //.. $urlRouterProvider.otherwise('/app/find/search');

So from looking at your code, I can see mistake. .state('find', { should be .state('app.find', { which would also change .state('find.search', { to .state('app.search', {

@mhartington But how can I make search a sub-state of find and accessible through the sidemenu? When I try creating and using app.find and the substate app.find.search, I get the white-screen. .config(function($stateProvider, $urlRouterProvider) { $stateProvider .state('app', { url: "/app", abstract: true, templateUrl: "templates/menu.html", controller: 'AppCtrl' }) .state('app.find', { url: "/app/find", views: { 'menuContent': { template: "find template" } } }) // doesn't work // .state('app.find.search', { // url: "/search", // views: { // 'menuContent': { // templateUrl: "templates/search.html" // } // } // }) // works .state('app.search', { url: "/search", views: { 'menuContent': { templateUrl: "templates/search.html" } } })

For this .state('app.find.search', { to work, app.find would need to be an abstract state. Try to think less on how the states can be structured in relation to one another, but how everything is related to the one ion-nav-view, menuContent. http://codepen.io/ionic/pen/tcIGK Look at how the states are set up in our default example. Also, the side-menu starter project

@dtslvr You, sir, saved my day.

Hierarchical States in "sidemenu" example ui-router

ionic-v1

dtslvr March 25, 2015, 9:51am 5

I had the same problem, this link has saved my day: Angularjs Nested states: 3 level.

Sharing data between views - 3 levels

Topic		Replies	Views
Nested state not loading with sidemenu ionic-v1	8	1589	August 21, 2015
Nested states with ion-nav-view ionic-v1	1	940	October 4, 2014
Side Menu Not Working Here's My Code ionic-v1	2	2530	April 8, 2016
Views and nested views ionic-v1	0	622	October 8, 2015
$routerProvider ionic-v1	2	746	November 10, 2015

Hierarchical States in "sidemenu" example ui-router

Related topics