我设置了标签但它没有在角度中导航其他标签

时间:2016-01-11 06:27:26

标签: javascript angularjs

http://www.tutorialrepublic.com/codelab.php?topic=bootstrap&file=create-dynamic-tabs-via-data-attribute

在上面的链接中,我找到了标签的代码,但它没有用。

2 个答案:

答案 0 :(得分:1)



(function () {
    var app = angular.module('myApp', []);

    app.controller('TabController', function () {
        this.tab = 1;

        this.setTab = function (tabId) {
            this.tab = tabId;
        };

        this.isSet = function (tabId) {
            return this.tab === tabId;
        };
    });
})();

<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div class="container">
    <section ng-app="myApp" ng-controller="TabController as tab">
        <ul class="nav nav-pills">
            <li ng-class="{active:tab.isSet(1)}"><a href ng-click="tab.setTab(1)">Tab 1</a></li>
            <li ng-class="{active:tab.isSet(2)}"><a href ng-click="tab.setTab(2)">Tab 2</a></li>
            <li ng-class="{active:tab.isSet(3)}"><a href ng-click="tab.setTab(3)">Tab 3</a></li>
        </ul>
        
        <div ng-show="tab.isSet(1)">
             <h4>Tab 1</h4>
        </div>
        <div ng-show="tab.isSet(2)">
             <h4>Tab 2</h4>
        </div>
        <div ng-show="tab.isSet(3)">
             <h4>Tab 3</h4>
        </div>
    </section>
</div>
&#13;
&#13;
&#13;

答案 1 :(得分:0)

是的,演示代码在FF中完美运行。