Question

我使用离子。当我从主页导航到标签页时，返回＆＃39;按钮消失了，进入标签页后我无法返回主页。我尝试在线搜索，但无法找到解决方案。有任何解决方法或我在任何地方做错了。这是我的代码的index.html

<html data-ng-app="tabsBack">
<head>
    <meta charset="utf-8" />
    <title>BlankCordovaApp1</title>

    <!-- BlankCordovaApp1 references -->
    <link href="css/index.css" rel="stylesheet" />
    <link href="http://code.ionicframework.com/1.0.0-beta.14/css/ionic.min.css" rel="stylesheet" />

    <!-- Cordova reference, this is added to your app when it's built. -->
    <script src="cordova.js"></script>
    <script src="scripts/platformOverrides.js"></script>
    <script src="http://code.ionicframework.com/1.0.0-beta.14/js/ionic.bundle.js"></script>
    <script>
        var app = angular.module('tabsBack', ['ionic']);
        app.config(function ($stateProvider, $urlRouterProvider) {
            $stateProvider
                .state('home', {
                    url: "/",
                    templateUrl: "home.html"
                })
                .state('tab', {
                    url: "/tab",
                    templateUrl: "tab.html"
                })
                .state('tab.one', {
                    url: '/one',
                    views: {
                        'tab-one': {
                            templateUrl: 'templates/tab-one.html',
                        }
                    }
                })
                .state('tab.two', {
                    url: '/two',
                    views: {
                        'tab-two': {
                            templateUrl: 'templates/tab-two.html',
                        }
                    }
                })

            $urlRouterProvider.otherwise('/');
        })
    </script>
    <script src="scripts/index.js"></script>
</head>
<body>
    <ion-nav-bar>
        <ion-nav-back-button class="button-clear">
            <i class="ion-arrow-left-c"></i> Back
        </ion-nav-back-button>
    </ion-nav-bar>
    <ion-nav-view></ion-nav-view>
</body>
</html>

Home.html中

<ion-view view-title="home">
    <ion-content>
        home<br />
        <a data-ui-sref="tab">tab</a><br />
    </ion-content>
</ion-view>

tab.html

<ion-tabs class="tabs-icon-top">
    <ion-tab title="One" icon="icon ion-ios7-paper" href="#/tab/one">
        <ion-nav-view name="tab-one"></ion-nav-view>
    </ion-tab>
    <ion-tab title="Two" icon="icon ion-ios7-paper" href="#/tab/two">
        <ion-nav-view name="tab-two"></ion-nav-view>
    </ion-tab>
</ion-tabs>

制表one.html

<ion-view title="One">
    <ion-content>
        <h1>One</h1>
    </ion-content>
</ion-view>

制表two.html

<ion-view title="Two">
    <ion-content>
        <h1>Two</h1>
    </ion-content>
</ion-view>

Answer 1

最后通过手动将后退按钮添加到标签页来实现它。在后退按钮的ng-click事件中使用$ionicGoBack($event)。这是完整的code。到目前为止，我没有遇到任何问题。

Answer 2

在tab-one.html和 tab-two.html

中使用离子窗格代替离子视图

Answer 3

@mahindar只是一种解决方法。

https://github.com/driftyco/ionic/issues/2997

中已解决此问题

Answer 4

这对我有用。将它放在你的控制器中。这会强制显示“后退”按钮。不是最优雅的。但它确实有效。

$scope.$on('$ionicView.beforeEnter', function (event, viewData) {
    viewData.enableBack = true;
});

希望有所帮助

如何在Ion-tabs页面中找回按钮

4 个答案: