부트 스트랩 UI의 활성 속성에 올바른 내용이 표시되지 않습니다.

Question

각도 앱에서는 부트 스트랩 ui.bootstrap 모듈을 사용하고 있습니다. 사이트를 통해 내 자신의 사용자 지정 ul을 사용하여 지정된 콘텐트를 표시하는 탭 단추 역할을해야했습니다. 그래서 같이 : 클릭에

<ul class="nav phase-pills"> 
    <li ng-click="activeTab = 0;>Green</li> 
    <li ng-click="activeTab = 1;>Amber</li> //user clicks. activeTab has value of 1 
    <li ng-click="activeTab = 2;>Red</li> 
    <li ng-click="activeTab = 3;">Blue</li> 
</ul> 

<uib-tabset active="activeTab" type="pills"> //activeTab 
    <uib-tab heading="Green" index="0" class="bg-phase-green font-body" ng-hide="true"> //ng-hide hides this tab and my own list item can act as the tab 
     //content 
    </uib-tab> 
    <uib-tab heading="Amber" index="1" ng-hide="true"> // index 1.. displays 
     //content 
    </uib-tab> 
    <uib-tab heading="Red" index="2" ng-hide="true"> 
     //content  
    </uib-tab> 
    <uib-tab heading="Blue" index="3" ng-hide="true"> 
     //content 
    </uib-tab>     
</uib-tabset> 

, activeTab 지정된 값으로 업데이트하고 해당 내용을 표시합니다.

내가 지금은 같은 컨트롤러에서 인덱스 값을 연결하고 같은 문제가 발생하지해야하는, 사용자 지정 탭을 표시 ng-repeat를 사용해야했다 : 나는이

vm.activityNotifications = [ 
    { 
     activity: 'Stage Change', 
     index: '0' 
    }, 
    { 
     activity: 'Transactions', 
     index: '1' 
    }, 
    { 
     activity: 'Renewals', 
     index: '2' 
    } 
] 

<ul class="nav btn-default view-pills"> 
    <li ng-repeat="item in $ctrl.activityNotifications" 
     ng-click="$ctrl.setActivityActiveTab(item.activity); 
        activeActivityTabResp = item.index" 
     ng-class="{active : $ctrl.activeMenu == item.activity}"> 
     <a class="nav-link">{{item.activity}}</a> 
    </li> 
</ul> 

한 기능을 추가하는 것입니다 활성 클래스입니다. item.index를 기록 할 때 콘솔에 표시되므로 관련 내용을 표시해야하지만 그렇지는 않습니다.

질문

왜 아닙니다 li 항목이 ngRepeat에서 클릭 할 때 표시하는 tabcontent?

<uib-tabset type="pills view-pills" active="activeActivityTabResp"> 
    <uib-tab heading="Stage Change" index="0" ng-hide="true"> 
     //content  
    </uib-tab> 
    <uib-tab heading="Transactions" index="1" ng-hide="true"> 
     //content  
    </uib-tab> 
    <uib-tab heading="Renewals" index="2" ng-hide="true"> 
     //content 
    </uib-tab> 
</uib-tabset> 

Answer 1

index 속성은 정수 여야합니다. https://plnkr.co/edit/GUVq5Mc3DvaAIITl8sLj?p=preview