복수 상태에서 ui-sref-active

Question

여러 상태에서 ui-sref-active를 활성화하려고합니다. 이것은 당신이 상태가 처음이며, 상태가 네번째 때 TEST2가 활성화 될 때 TEST1가 활성화됩니다 볼 수 있듯이 내가

<a ui-sref-active="active" ui-sref="first"><span>1</span> test1</a> 
<a ui-sref-active="active" ui-sref="fourth"><span>2</span> test2</a> 

을 것입니다. 하지만 test1이 두 번째 및 세 번째 상태에서도 활성화되기를 바랍니다. 어떻게해야합니까?

Answer 1

나는 includedByState 필터를 사용하도록 권장합니다.

<a ui-sref="first" ng-class="{active: ('first' | includedByState) || ('second' | includedByState) || ('third' | includedByState)}"> 
    <span>1</span> test1 
</a> 
<a ui-sref-active="active" ui-sref="fourth"> 
    <span>2</span> test2 
</a> 

이렇게하면 코드가 생성되지만 원하는대로 수행됩니다.

은 또한 당신이 당신의 구성 요소에 함수를 만들 수 있습니다, 그 논리를 처리합니다

//component function 
activateTest() { 
    return $filter('includedByState')('first') || 
    $filter('includedByState')('second') || 
    $filter('includedByState')('third'); 
} 

//html 
<a ui-sref="first" ng-class="{active: $ctrl.activateTest()}"> 
    <span>1</span> test1 
</a> 

이 또한 트릭을해야한다.