Angularjs 引导UI：随时间自动移动选项卡_Angularjs_Twitter Bootstrap_User Interface_Tabs

Angularjs 引导UI：随时间自动移动选项卡

angularjs twitter-bootstrap user-interface tabs

Angularjs 引导UI：随时间自动移动选项卡,angularjs,twitter-bootstrap,user-interface,tabs,Angularjs,Twitter Bootstrap,User Interface,Tabs,我有一个AnguleJS Bootstrp UI水平选项卡结构单击选项卡2后，将显示选项卡2的内容，与选项卡3的内容相同我的问题是: 我想实现一种方式，在3000毫秒后，Tab 2自动显示&在Tab 3之后，无需单击Tab。一旦我点击任何一个特定的标签，它就会停止并显示该标签的内容下面是水平选项卡视图（Onclick）的演示： {{tab.content} 因此有一个名为active的指令变量您可以在其中传递一个变量，该变量指示选项卡是否应处于活动状态将这些变量放入数组，设置一个间隔

我有一个AnguleJS Bootstrp UI水平选项卡结构

单击选项卡2后，将显示选项卡2的内容，与选项卡3的内容相同

我的问题是:

我想实现一种方式，在3000毫秒后，Tab 2自动显示&在Tab 3之后，无需单击Tab。一旦我点击任何一个特定的标签，它就会停止并显示该标签的内容

下面是水平选项卡视图（Onclick）的演示：


{{tab.content}

因此有一个名为

active的指令变量

您可以在其中传递一个变量，该变量指示选项卡是否应处于活动状态

将这些变量放入数组，设置一个间隔，并使用索引将右侧选项卡设置为活动

我的工作伙伴：

也许可以使用angular的

$interval

+1作为答案！！但是，由于我不想在单击按钮时更改选项卡，是否可以在不单击开始按钮的情况下自动调用该函数？停止对我来说是可以的。当然，只需调用控制器末尾的方法。现在检查plunker；）

<!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>