Question

标签为什么不切换？当我点击标签2或其他时，它似乎什么都不做。

    <div class="container">
    <h1>Bootstrap AngularJS Tabs</h1>
    <div ng-app="">
    <div ng-init="names = [{name:'one'}, {name:'two'}, {name:'three'}, {name:'four'}, {name:'five'}]">
            <ul class="nav nav-tabs">
                    <li ng-repeat="name in names" ng-class="{active: $index == 0}">
        <a href="#tab{{$index + 1}}" data-toggle="tab">Tab {{$index + 1}}</a>
                    </li>
            </ul>
    <div class="tab-content">
    <div class="tab-pane fade in" id="tab{{$index + 1}}" ng-repeat="name in names" ng-class="{active: $index == 0}">
        <span>{{$index + 1}}</span><span>{{$index+2}}</span>
    </div>
            </div>

            </div>
            </div>
    </div><!--/container-->
    <script src="./angular.min.js"></script>
    <script src="./bootstrap.min.js"></script>

Answer 1

这是因为您始终通过ng-class="{active: $index == 0}"将第一个标签设置为有效。您需要将$index与用户点击标题页时更改的范围内的属性进行比较（通过组合锚点上的href和ng-click）。像这个简化版本的东西：http://jsbin.com/tesosisi/1/edit

该示例在控制器中设置$scope.names.activeIndex = 0;，但您需要检查当前位置哈希以查看从一开始就应激活哪个选项卡。

angularjs标签不会切换？

1 个答案: