user3364825
user3364825

Reputation: 1561

AngularJS: dynamically populating a sidebar and main content area

I'm writing an SPA with AngularJS. I've got a layout page with a sidebar and a main content area. I'd like to be able to, based on the current route, dynamically construct the sidebar contents and main content area. I can handle the main content area with <ng-view> and partial HTML templates, but this leaves the sidebar unchanged. Is there a good pattern for this in Angular?

Upvotes: 1

Views: 2678

Answers (1)

DevTrong
DevTrong

Reputation: 468

take a look at my jsfiddle: http://jsfiddle.net/U3pVM/9955/

I have a SidebarItemService which holds an array of sidebar-items. You can add or remove items there.

My sidebar directive binds to this SidebarItemsService and everytime the state / route changes, it will clear all items from the sidebar (stateChangeStart / routeChangeStart event).

Now you can add some items in your controller.

Hope it helps!

Upvotes: 4

Related Questions