angularjs - Accessing the state of AngularUI tab from within the elements it contains -


I used AngularUI to create a tabbed bootstrap theme:

   ; Tabset & gt; & Lt; Tab & gt; & Lt; Tab-heading & gt; JavaScript & lt; Span class = "badge" & gt; {{Count}} & lt; / Span & gt; & Lt; / Tab-heading & gt; & Lt; / Tab & gt; & Lt; Tab & gt; & Lt; Tab-heading & gt; Python & lt; Span class = "badge" & gt; {{Count}} & lt; / Span & gt; & Lt; / Tab-heading & gt; & Lt; / Tab & gt; & Lt; Tab & gt; & Lt; Tab-title & gt; Ruby & lt; Span class = "badge" & gt; {{Count}} & lt; / Span & gt; & Lt; / Tab-heading & gt; & Lt; / Tab & gt; & Lt; / Tabset & gt;   

those & lt; Span & gt; See {{count}} with ? I would like them to be shown only that if their tabs are selected (active) Something like this will happen:

  & lt; Span ng-show = "tab.active" class = "badge" & gt; {{Count}} & lt; / Span & gt;  

This does not work, so I wrote the $ scope.setActiveTab and the $ scope.isTabActive function and now my code like this Looks:

  & lt; Select the tab = "Set Active tab (0)" & gt; & Lt; Tab-heading & gt; JavaScript & lt; Span ng-show = "isTabActive (0)" square = "badge" & gt; {{Count}} & lt; / Span & gt; & Lt; / Tab-heading & gt; & Lt; / Tab & gt; & Lt; Select the tab = "setActiveTab (1)" & gt; & Lt; Tab-heading & gt; Python & lt; Span ng-show = "isTabActive (1)" class = "badge" & gt; {{Count}} & lt; / Span & gt; & Lt; / Tab-heading & gt; & Lt; / Tab & gt; & Lt; Tab select = "setActiveTab (2)" & gt; & Lt; Tab-heading & gt; Ruby & lt; Span ng-show = "isTabActive (2)" square = "badge" & gt; {{Count}} & lt; / Span & gt; & Lt; / Tab-heading & gt; & Lt; / Tab & gt;  

It works, but looks ugly. (This alone will not work with more than one tabset)

Is there a better way to reach the position of tabs than those spans?

My current code:

This is a ng-repeat

  & lt; Tab ng-repeat = "tab in tab" active = "tab. Active" & gt; ... ng-show = "tab. Active"  


Comments

Popular posts from this blog

sqlite3 - UPDATE a table from the SELECT of another one -

c# - Showing a SelectedItem's Property -

javascript - Render HTML after each iteration in loop -