Question

如果我有一个带有2个标签的页面。如果从第二个标签我导航到不同的页面。那么如何从导航页面回到第二个标签？我正在使用$ StateProvider。

感谢。

Answer 1

以下是示例代码，效果很好，

index.html
----------------
<html>
  <head>
    <title>Tabs Directive</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0-rc.0/angular.min.js"></script>
    <script src="tabController.js"></script>
  </head>
  <body>
    <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>
  </body>
</html>

tabController.js
----------------
    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;
        };
    });

Answer 2

谢谢Atul :)

但这个解决方案对我有用。

我们可以在APPCONTEXT.js文件中有一个标志varibale ilke ＆＃34; this.isPageVisited = false＆＃34; 。这样变量将在整个项目中可用。所以假设从一个页面的标签我要去不同的页面，我做的是我在访问页面中通过setter方法设置 isPageVisited = true 。所以现在再次回到标签页，我们检查变量是否为真。如果确实如此，我们将＆＃34;活跃的＆＃34; class属于tab元素。这样我们就可以从导航开始的地方激活当前标签。

如何从制表符导航到angularJS中的不同页面和反之？

2 个答案: