Global ion-nav-view (solved!)

ionic-v1
1

How can i ‘re-use’ the same ion-nav-view, between different pages?

Let say I have a stateProvider

$stateProvider
  .state('home', {
    url: '/',
    views: {
      '': {
        templateUrl: 'template/home.html',
        controller: 'homePageController'
      }
    }
  })
  .state('messageList', {
    url: '/messageList',
    views: {
      messageOverview: {
        templateUrl: 'template/messageOverview.html',
        controller: 'messageOverviewController'
      }
    }
  });

When I do this:

$state.go('messageList');

It expects another ion-nav-view

So I end up having this:

<ion-nav-view name=""></ion-nav-view>
<ion-nav-view name="messageList"></ion-nav-view>

But the bad thing is it doesn’t really ‘replace’ the old view… When you have a lot of pages, it would get a huge DOM, what slows things down…

So is it by design? Or does anybody know the correct way?

Many thanks!

2

Damn… The solution proved to be simple…

In the $stateProvider, the ‘views’ object first elements name, is the ‘nav-view’ it will look for…

$stateProvider
  .state('home', {
     url: '/',
     views: {
        '': { // <-- Over here
              templateUrl: 'template/home.html',
               controller: 'homePageController'
            }
     }
});

Now I also understand the purpose of it… Thanks anyway!