AngularJS + Bootstrap : Routing and navigation doesn't work in directive

[m48u]

Hi there,

this case is abit complicated so I try to explain my problem properly.

My first draft was a simple page and a static navigation. Then I added routing to make navigation easier and parts of the page 'bookmarkable'.

Then I changed navigation into 'nav-pills' from twitter-bootstrap, which was also not that big problem. But could I make it dynamic?

I've build a directive to generate the navigation from the JSON file which will be styled with twitter bootstrap (nav-pills and dropdown) afterwards.

Worked at first sight, but one problem remains: After changing to the directive the highlighning of the selected item doesn't work any more.

I created a jsfiddle to demostrate the difference.

http://jsfiddle.net/m48u/8wECG/1/

Is it possible to make the directive work?

Thanks in advance,

m48u

[Roy Choo]

Do you mean highlighting of the selected menu?

i am looking thru the dropdown.

But that doesn't have the highlighted item .

http://twitter.github.com/bootstrap/javascript.html#dropdowns

Regards

Roy

[Peter Bacon Darwin]

You don't need to wrap the project.name up in quotes and curly braces:

<li ng-repeat="project in projects | filter: category" ng-class="{active: loc.path() == &apos;/&apos;+project.name}"><a href="#/{{project.name}}">{{project.name}}</a></li>

http://jsfiddle.net/8wECG/2/

Pete

--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To post to this group, send email to ang...@googlegroups.com.
To unsubscribe from this group, send email to angular+u...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular?hl=en.
 
 

[m48u]

that was easy. Thanks for your reply

[m48u]

Do you know how I could get the category 'active' as well? So it would be possible to see in which category the selected item is.

Thanks in advance

[Peter Bacon Darwin]

Best thing to do is to start putting this behaviour into your controllers. You could have a function that checks to see if a child of the project is active.

Pete
...from my mobile.