2014-04-28 2 views
0

저는 AnguleJS Bootstrp UI 수평 탭 구조를 가지고 있습니다.부트 스트랩 UI : 자동 탭 시간 이동

enter image description here

내가 탭 탭 2 탭이 표시의 내용과 동일한를 클릭하면 3

내 질문은 :

내가하는 방식으로 구현하려는이 3000 밀리 초 후 해당 탭 3을 클릭 한 후 Tab 2 자동 표시 &을 클릭하십시오. 일단 특정 탭을 클릭하면 해당 탭의 내용이 중지되고 표시됩니다.

여기 수평 탭보기위한 데모 (온 클릭)이다 Plunker Demo

<!doctype html> 
<html ng-app="plunker"> 
    <head> 
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.8/angular.js"></script> 
    <script src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.10.0.js"></script> 
    <script src="example.js"></script> 
    <link href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet"> 
    </head> 
    <body> 

<div ng-controller="TabsDemoCtrl"> 

    <tabset> 

    <tab ng-repeat="tab in tabs" heading="{{tab.title}}"> 
     {{tab.content}} 
    </tab> 

    </tabset> 


</div> 
    </body> 
</html> 

답변

1

그래서 탭이 활성화되어야 여부를 나타내는 active가이 변수를 전달할 수라는 지시 변수가있다.

변수를 배열에 넣고 간격을 설정하고 색인을 사용하여 오른쪽 탭을 활성화합니다.

내 작업 플러커 : PlunkerDemo 각도가 $interval 일 수 있습니다.

+0

+1 대답! 그러나 클릭시 탭 변경을 수행하지 않으려면 시작 버튼을 클릭하지 않고 자동으로 함수를 호출 할 수 있습니까? 그만 그만해. –

+0

컨트롤러의 끝에서 메소드를 호출하기 만하면됩니다. 지금 plunker를 확인하십시오;) –

+0

고마워요! –