角度引导程序选项卡-在页面加载中调用选择功能

萨纳特

我有以下格式的角度引导标签。(请参阅缩孔器)

选择选项卡时,应该触发选择功能。但是奇怪的是,当页面加载时,第一个选项卡的选择功能被触发。(在“打印”选项卡上选择了“动态标题1”。)

"http://plnkr.co/edit/vyOOhCdIl7s1Wvou7Dr9?p=preview"

angular.module('ui.bootstrap.demo', ['ui.bootstrap']);
angular.module('ui.bootstrap.demo').controller('TabsDemoCtrl', function ($scope) {
  $scope.tabs = [
    { title:'Dynamic Title 1', content:'Dynamic content 1' },
    { title:'Dynamic Title 2', content:'Dynamic content 2' },
    { title:'Dynamic Title 3', content:'Dynamic content 3' }
  ];
  
  $scope.tabSelect = function(title){
    console.log("tab selected "+title);
  };

});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<!doctype html>
<html ng-app="ui.bootstrap.demo">
  <head>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.13/angular.js"></script>
    <script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.13.0.js"></script>
    <script src="example.js"></script>
    <link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">
  </head>
  <body>
    <div ng-controller="TabsDemoCtrl">
      <tabset>
        <tab ng-repeat="tab in tabs" heading="{{tab.title}}" active="tab.active" disable="tab.disabled" select="tabSelect(tab.title)">
          {{tab.content}}
        </tab>
      </tabset>
    </div>
  </body>
</html>

乔·贾达梅克(Joe Jadamec)

将您的选择更改为ng-click,如下所示:

<tab ng-repeat="tab in tabs" heading="{{tab.title}}" active="tab.active" ng-click="tabSelect(tab.title)">

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

引导程序中的嵌套选项卡

来自分类Dev

引导程序中的嵌套选项卡

来自分类Dev

动态选项卡中的动态内容(角度,UI引导程序)

来自分类Dev

新选项卡中的角度打开组件,无需引导整个应用程序

来自分类Dev

使用角度ui引导程序时,一个静态选项卡中的按钮显示第二个选项卡不起作用

来自分类Dev

使用角度ui引导程序时,一个静态选项卡中的按钮显示第二个选项卡不起作用

来自分类Dev

使用引导程序从选项卡调用另一个选项卡?

来自分类Dev

如何预选择数据绑定的引导程序选项卡

来自分类Dev

从多个位置调用引导程序选项卡

来自分类Dev

引导程序选项卡中的标题<h1>?

来自分类Dev

阻止在引导程序3中显示选项卡内容?

来自分类Dev

阻止在引导程序3中显示选项卡内容?

来自分类Dev

引导程序中的选项卡和药丸

来自分类Dev

突出显示引导程序 3 中的活动选项卡

来自分类Dev

引导程序选项卡面板选项卡-禁用页面滚动到元素的ID

来自分类Dev

引导选项卡,如何设置页面加载时选择的选项卡?

来自分类Dev

引导选项卡,如何设置页面加载时选择的选项卡?

来自分类Dev

角度引导UI选项卡选择选项不起作用

来自分类Dev

表单提交后,引导程序选项卡转到同一页面上的特定选项卡

来自分类Dev

表单提交后,引导程序选项卡转到同一页面上的特定选项卡

来自分类Dev

重新加载页面后,如何使用引导程序使当前选项卡保持活动状态?

来自分类Dev

使用 jQuery 在页面加载时打开特定的引导程序选项卡

来自分类Dev

如何通过单击引导程序中当前选项卡内的按钮转到其他选项卡

来自分类Dev

使用引导程序中设置的两个不同选项卡关闭选项卡切换

来自分类Dev

单击angular-ui引导程序选项卡选择功能

来自分类Dev

角引导程序ui选项卡选择选项不起作用

来自分类Dev

无法访问子页面“引导程序”选项卡中的对象属性

来自分类Dev

如何从引导程序中的另一个页面激活动态选项卡?

来自分类Dev

选项卡引导中选项卡中选项卡中的嵌套选项卡

Related 相关文章

  1. 1

    引导程序中的嵌套选项卡

  2. 2

    引导程序中的嵌套选项卡

  3. 3

    动态选项卡中的动态内容(角度,UI引导程序)

  4. 4

    新选项卡中的角度打开组件,无需引导整个应用程序

  5. 5

    使用角度ui引导程序时,一个静态选项卡中的按钮显示第二个选项卡不起作用

  6. 6

    使用角度ui引导程序时,一个静态选项卡中的按钮显示第二个选项卡不起作用

  7. 7

    使用引导程序从选项卡调用另一个选项卡?

  8. 8

    如何预选择数据绑定的引导程序选项卡

  9. 9

    从多个位置调用引导程序选项卡

  10. 10

    引导程序选项卡中的标题<h1>?

  11. 11

    阻止在引导程序3中显示选项卡内容?

  12. 12

    阻止在引导程序3中显示选项卡内容?

  13. 13

    引导程序中的选项卡和药丸

  14. 14

    突出显示引导程序 3 中的活动选项卡

  15. 15

    引导程序选项卡面板选项卡-禁用页面滚动到元素的ID

  16. 16

    引导选项卡,如何设置页面加载时选择的选项卡?

  17. 17

    引导选项卡,如何设置页面加载时选择的选项卡?

  18. 18

    角度引导UI选项卡选择选项不起作用

  19. 19

    表单提交后,引导程序选项卡转到同一页面上的特定选项卡

  20. 20

    表单提交后,引导程序选项卡转到同一页面上的特定选项卡

  21. 21

    重新加载页面后,如何使用引导程序使当前选项卡保持活动状态?

  22. 22

    使用 jQuery 在页面加载时打开特定的引导程序选项卡

  23. 23

    如何通过单击引导程序中当前选项卡内的按钮转到其他选项卡

  24. 24

    使用引导程序中设置的两个不同选项卡关闭选项卡切换

  25. 25

    单击angular-ui引导程序选项卡选择功能

  26. 26

    角引导程序ui选项卡选择选项不起作用

  27. 27

    无法访问子页面“引导程序”选项卡中的对象属性

  28. 28

    如何从引导程序中的另一个页面激活动态选项卡?

  29. 29

    选项卡引导中选项卡中选项卡中的嵌套选项卡

热门标签

归档