2014-01-22 6 views
0

나는 UI 라우터를 사용하여 각도로 ul 목록을 가지고 있습니다. $scope 데이터를 기반으로 목록을 만들고 상태에 따라 active 앵커를 올바르게 표시합니다. 그러나, 나는 스타일을 목적으로 li 부모를 활성으로 표시하는 우아한 방법을 찾는 데 어려움을 겪고 있습니다.UI 라우터 상태 수신기 지시문

HTML :

<ul> 
    <li ng-repeat="item in items"> 
     <a ui-sref="{{item.sref}}" ui-sref-active="active"> 
      {{item.name}} 
     </a> 
    </li> 
</ul> 

JSON :

$scope.items = [ 
    {name:'Foo Stuff',sref:'foo'}, 
    {name:'Bar Things',sref:'bar'}, 
] 

내가 저 자식 요소의 클래스를 기반으로 요소의 스타일을 할 수 있도록 할 일부 CSS의 치트 코드가 있었다 기대했다. 가능한 경우 추가 프레임 워크를 추가하지 않고 해결책을 찾고 싶습니다. 지금 Angular JS, UI-Bootstrap 및 UI-Router를 사용하고 있습니다. 모든 의견을 매우 높이 평가합니다!

답변

0

물론 질문을 올린 후 0.69 초 만에 계산했습니다. 내가 그 정확성에 의문을 제기하는 것은 너무 단순 해 보입니다. 방금 ui-sref-active="active을 부모 li으로 옮겼습니다.

HTML :

<ul> 
    <li ng-repeat="item in items" ui-sref-active="active> 
     <a ui-sref="{{item.sref}}"> 
      {{item.name}} 
     </a> 
    </li> 
</ul> 
관련 문제