This lesson is for PRO members.

Unlock this lesson NOW!
Already subscribed? sign in

AngularJS Architecture: navigating between states with ui-router

5:00 Angular 1.x lesson by

Now that we have ui-router states in our Angular application, we can discuss the three ways to activate a state within ui-router. We will programmatically activate a state using $state.go and capture user interactions with the ui-sref directive.

Get the Code Now
click to level up

egghead.io comment guidelines

Avatar
egghead.io

Now that we have ui-router states in our Angular application, we can discuss the three ways to activate a state within ui-router. We will programmatically activate a state using $state.go and capture user interactions with the ui-sref directive.

Avatar
Nathan

In this lesson you show how you can navigate to a specific state via the url. You show that by changing the url you can filter the bookmarks to a specific category. What I don't see is the left hand category navigation updating when you do that. If you click a category on the left it will be marked active. How do you achieve this via a url.

Avatar
Sher

I notice that this lesson as well as "Prefer the 'Controller as' Syntax" and "Create Bookmark" do not have transcripts. I use this transcripts as lesson notes which I annotate, including Screen Shots, and which I can then share with a colleague who is also an Egghead member. Are these missing transcripts an oversight?

In reply to egghead.io
Avatar
John

My params are immediately reset to undefined/empty object when I click on a category. Any ideas?
$scope.currentCategoryName => Development
bookmarks.js:23 $stateParams => Object {category: "Development"}
bookmarks.js:22 $scope.currentCategoryName => undefined
bookmarks.js:23 $stateParams => Object {}

Avatar
Lukas

Hey John,
Good catch! There was a bug in the code; in the categories template, we were using main.category.name when we should have used main.currentCategory.name. This has been fixed, so please pull down the latest version of the branch.

In reply to John
Avatar
John

Thank you for the fast response! I am loving that darcula theme.

In reply to Lukas
Avatar
skelesp

I had a problem trying to use this lesson in my project. I found the issue, but I think it's useful to mention it here too for others with the same problem.

The $state.go is only working when the link containing the setCurrentCategory() function, doesn't have a href="#" attribute.
Maybe I missed the removal in an earlier lesson, but it's safe to mention it again.

Avatar
Sina

Thank you for sharing, it solved my problem.

In reply to skelesp
HEY, QUICK QUESTION!
Joel's Head
Why are we asking?