Transitioning between pages


#1

I’m extremely new, so sorry for if I sound like an idiot.

I’ve used the tabs template and have built out all my tabs. I’m having a heck of a time creating a button or list link that will navigate from the tab it’s on, to another section. It’s almost working, but I’m not sure what I’m doing wrong. Heres my page: (tab-virtual.html)

<ion-view title="Virtual Sample Kit">
  <ion-content class="has-header padding">
  <a class="button icon icon-right ion-chevron-right" href="#/facts/1">test</a>
     </ion-content>
</ion-view>

Here’s what I put in app.js:

.state('facts', {
url : '/facts/:factsId',
templateUrl : 'templates/facts.html'
})

Then i created a “facts.html” which contains the HTML i want displayed.

When I click the button on the first page above, it takes me to the facts.html page, but the nav bar at the top doesn’t show a back button, and it doesn’t transition left to right. Do I need to create a controller like this?

.controller('FactsController', function($scope) {
})

Then place it in the state? or is that irrelevant. I tried following this http://codepen.io/ionic/pen/odqCz however the HTML looks so different from the template i’m working in. So i’m confused how to apply it to the core tabs template.


#2

Just wondering, your state setup, do you mean to put the url as '/facts/:factsId'?