11

Starting with angularjs as a newbie I have created a navigation bar. It has several sub menus. But I am not completely sure what is the best practice to deal with it using angularjs. I would like to keep track of the current selected menu item to make it 'active' and change the rendered template depending on the selection.

I am looking for some examples or some example code, that can be used in production environment.

Sorry for this very generic question, but I hope someone can help me.

Mark
  • 7,507
  • 12
  • 52
  • 88
  • 1
    Use the $location service to change the current route, and know which route is currently displayed. – JB Nizet Aug 22 '13 at 22:23
  • 1
    See http://stackoverflow.com/questions/16199418/how-do-i-implement-the-bootstrap-navbar-active-class-with-angular-js – Mark Rajcok Aug 23 '13 at 13:28

1 Answers1

5

Have a look at angular-ui/ui-router. It adds named views and states to your app. You can define "areas" in your main template that, based on the "state" your app is in, display a certain template+controller.

Edit: yes, $location could be enough for a simple application but by the time your one-per-screen controller gets to be 100 lines of $scope.$watch definitions you start realizing you need something more.

Mark
  • 7,507
  • 12
  • 52
  • 88
Sergiu Paraschiv
  • 9,929
  • 5
  • 36
  • 47