Navigate to Different Tab Within Controller?


#1

Hello!

In my app.js I am using the $stateprovider to hook me up with different tabs.

.state('tab.one') controller: mainCtrl ... 
.state('tab.two') controller: secondCtrl ...

On submitting a form, I run the following function:

tab-one.html

ng-submit="createEntry(entry)"

mainCtrl

$scope.createEntry(entry) {
bloop bloop beep doop
// navigate to state('tab.two');
}

Within the $scope.CreateEntry(entry), I’d like to simply navigate at the end of the entry being created to the tab that shows all entries.

How is this achievable within the Javascript?

Thanks :heart:


#2

I think You should use Angular’s $location:

$scope.createEntry(entry) {
  bloop bloop beep doop
  $location.path('STATE URL HERE');
}

You can read more on $location here


#3

So simple, this is exactly what I needed :smiley: Thank you!

Any ideas on how to animate this transition? It’s rather abrupt.


#4

Glad I could help :blush:

As for the animations I think You can declare ‘ngAnimate’ in Your app and then use the CSS animation effects, check out the informations here and the answer here

Remember CSS animations are global, so whatever You decide to use will be applied every time the given view is loaded. If You need to separate Your animations You would have to write directives that add or remove specific classes, or use ng-class.

Hope that helps :slight_smile: