【问题标题】:Angular Bootstrap Tabs , href doesn't workAngular Bootstrap 选项卡,href 不起作用
【发布时间】:2015-06-27 12:16:36
【问题描述】:

我正在尝试使用这样的角度引导选项卡:

    <div >
    <tabset>
        <tab ng-repeat="t in tabs">
            <tab-heading>{{t.title}} <a  ng-click="removeTab($index)" href='#Evaluation'><i class="glyphicon glyphicon-remove-sign"></i></a></tab-heading>
            <!-- <div ng-bind='t.content'></div> -->
        </tab>
    </tabset>
</div>
<div id="Informations">Infos</div>
<div id="Evaluation">Evaluation</div>

js 是:

monAppli.controller("Controleur", function ($scope) {
    $scope.tabs = [{        
        title: "Informations",
        content: '<h1>tab one</h1>'
    }, {
        title: "Evaluation",
        content: '<h1>tab two</h1>'
    }, {
        title: "Projets",
        content: '<h1>tab three</h1>'
    }, {
        title: "Notes",
        content: '<h1>tab 4</h1>'
    }
    ];
    $scope.removeTab = function (index) {
        $scope.tabs.splice(index, 1);
    }; 
});

但是href链接不起作用,它没有单独显示每个div。有人知道吗?万分感谢 单击选项卡时应该显示z div“评估”,但它什么也不显示。

我也试过这个:

<div >
        <tabset>
            <tab ng-repeat="t in tabs">
                <tab-heading>{{t.title}} <a  ng-click="removeTab($index)" data-target="#{{t.title}}"><i class="glyphicon glyphicon-remove-sign"></i></a></tab-heading>
                <!-- <div ng-bind='t.content'></div> -->
            </tab>
        </tabset>
    </div>
    <div id="Informations">Infos bla bla bla</div>
    <div id="Evaluation">try bla bla bla</div>

那里有一个小提琴http://jsfiddle.net/alfrescian/ZE9cE/

但它没有显示如何显示与一个选项卡相关的一个 div。

【问题讨论】:

标签: javascript html angularjs twitter-bootstrap


【解决方案1】:

href='#Evaluation' 更改为data-target='#Evaluation'(完全删除href)。

【讨论】:

  • 您好,非常感谢!我试过
    {{t.title}}
    Infos
    尝试
    它仍然不起作用,我不知道如何隐藏 2 div“信息”和“评估”
猜你喜欢
  • 2013-10-14
  • 2015-09-30
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2018-07-13
  • 1970-01-01
  • 1970-01-01
  • 2022-09-28
相关资源
最近更新 更多