Creating shared routes in different views

ionic-v1
1

Slowly, slowly wrapping my head around all this.

I have an app that uses tabbed navigation. Most of the views show some form of list data (one is on a map, another is a flat list). The map view and list view are in separate tabs. They both provide a means to drill down from the brief info to detailed info. While they provide different ways to view the brief data, the detail view will be the exact same.

As I understand it, when a route is defined, you specify the view that the template will go into. When the route is hit, the content is rendered in that view. In my case, I sometimes want the detail view under my Map tab; at other times, under my List tab. The way I currently define routes, I will have to define two routes to pull that off:

.state('tab.property-detail', {
	url: '/property/:propertyId',
	views: {
		'tab-map': {
			templateUrl: 'templates/property-detail.html'
		}
	}
})

If I use that route in both places, then pulling up a detail view from the list tab will first switch me over to the map tab.

My question is, is there a way to define the route so that it opens under the current view without switching tabs, or will I have to define multiple routes that draw from the same template and controller.

1 Like
2

Unfortunately no this isnt possible. Ui-router just doesn’t support it. Others have tried and we all came to the same soultion

3

Hi everyone, as far as i know navigation rules has changed on beta 14.
i use shared views in my app :


thanks to ui router specific properties. navigation used to work with beta13.
The problem with the new version ( beta14) is navigation doesn’t work anymore…
Do i need to code my own navigation mechanism or i can use the default ion-nav-back-button ?
thank’s for your reply !

4

The problem with that method is that uirouter loaded the detail template on both tabs.
So if you move to detail-view from home-tab, and go to ?-tab, ?-tab will also show the detail-view. And there is no way to go back to the list, in your example.
I had trouble with this as well.
I just went with creating multiple states, since i could not find any other solution.
Would be a lot cleaner code if this was possible tho.
It also becomes problematic if for example I have main-tab which has 5 tabs and a view that contains a sub-tab which has 3 tabs. In this case, I end up having to create 15 tabs just for this…
It seems very unnecessary.
Please update if anyone has good solution to this!

1 Like