Transitions with $location.path(page)


#1

Getting started on my first real Ionic project, I’ve run in to an interesting scenario. I have a tab bar at the bottom and two tabs can navigate to the same page. Others are not on a tab at all. I’ve solved this by creating a “hidden-tab” that’s hidden with CSS and I put any of my non-tab pages under that. I’m sure there must be a better way.

For now, that works, but I’ve lost nifty page animations. Is there a way to request a transition be used between two pages? Maybe an object that extends $location and accepts a second animation parameter? Something like:

$ionicLocation.path('/tab/somePage','backwards');

Does anything like this exist?


Page transition animation fires every other time
#2

Figured out how to format my states for pages not under a tab. The views parameter, along with parameter underneath are unnecessary. Just put your templateUrl and controller parameters directly under state. Like So:

// pages not underneath tab bar
.state('thing', {
  url: '/thing/:thingId',
  templateUrl: 'templates/thing.html',
  controller: 'ThingDetailCtrl'
})

Still stuck on the animation bit


#3

I had some issues with links to pages not underneath a tab bar using $location.path(). It would appear linking to pages by $state.go() is a better route. (get it… route)


#4

Hey @perrygovier, I’m not sure exactly the best way to do this, it’s kind of a strange use of tabs to be honest. I wonder if there was a better way to arrange them?


#5

It is, some things were able to be moved to a modal window that made a bit more sense. I can see there being a need to define transitions between states though. Given how states are not necessarily pages though, that might be a pandora’s box trying to make it work in every case.