Come forzare il pulsante Ionic display indietro su determinate pagine?

Question

Durante la navigazione da una pagina all'altra, Ionic visualizza automaticamente il pulsante Indietro nella barra di navigazione. Tuttavia, ci sono alcuni casi in cui ionico non visualizza il pulsante indietro. Ad esempio, quando si passa da una pagina scheda a una scheda non attiva.

Come posso forzare Ionic a visualizzare il pulsante Indietro in determinate pagine?

Javascript:

.state('app.tab.playlists', { //<!-- Tab content page 
    url: '/playlists', 
    views: { 
    'tab-Content': { 
     templateUrl: 'templates/playlists.html', 
     controller: 'PlaylistsCtrl' 
    } 
    } 
}) 

.state('app.singer', { //<!-- Not tab content page (if you navigate from tab page to this page, back button will not displayed) 
    url: '/singer', 
    views: { 
    'menuContent': { 
     templateUrl: 'templates/singer.html' 
    } 
    } 
}) 

Answer 1

si può dire che nel controller.Prova:

.controller('yourCtrl', function($scope) { 

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

}) 

Ma come ha detto LeftyX. La funzione di cronologia per la visualizzazione da tab a non tab è errata.

Answer 2

ionico gestisce un history mentre si sta navigando da una vista all'altra.

$ ionicHistory tiene traccia delle visualizzazioni mentre l'utente naviga attraverso un'app . Simile al modo in cui si comporta un browser, un'app Ionic è in grado di tenere traccia della vista precedente, della vista corrente e della vista avanti (se ce n'è una). Tuttavia, un tipico browser Web conserva solo la traccia di uno stack cronologico in modo lineare.

A differenza di un ambiente browser tradizionale, le app e le applicazioni web hanno storie indipendenti parallele parallele, ad esempio con schede. Se un utente naviga poche pagine in profondità in una scheda, quindi passa a una nuova scheda e indietro, il pulsante Indietro non si riferisce alla scheda precedente, ma alle pagine precedenti visitate all'interno di quella scheda.

C'è un bug aperto su github che non è stato ancora fissato (e sarà fissato solo in 2.0) in cui Adam Bradley afferma:

Il pulsante Indietro non viene visualizzato perché quando si va in una scheda, è inserire la propria "cronologia", il che significa che ogni scheda ha la propria navigazione indietro e avanti.

Quindi, in pratica, quando si passa dalle schede alla vista normale si perde il pulsante Indietro.

Che cosa si può fare è di creare uno voi stessi:

<ion-nav-buttons side="left"> 
    <button class="button back-button buttons button-clear header-item" ng-click="goBack()"> 
     <i class="icon ion-ios-arrow-back"> Back</i> 
    </button> 
</ion-nav-buttons> 

e inserirlo all'interno della vostra vista:

<ion-view view-title="home"> 

    <ion-nav-buttons side="left"> 
    <button class="button back-button buttons button-clear header-item" ng-click="goBack()"> 
     <i class="icon ion-ios-arrow-back"> Back</i> 
    </button> 
    </ion-nav-buttons> 

    <ion-content padding='true' scroll='false' has-footer='false'> 

     <div class="card"> 
      <div class="item item-text-wrap"> 
       HOME PAGE 
      </div> 
     </div> 

    </ion-content> 

</ion-view> 

Come potete vedere ho usato ng-click="goBack()" per il pulsante.

Nel vostro controller semplicemente farebbe:

$scope.goBack = function(){ 
    $ionicHistory.goBack(); 
} 

non dimentica l'iniezione di $ionicHistory nel controllore.

PS: Questa è una soluzione semplicistica in quanto non controlla se la storia ha una backview:

$ionicHistory.viewHistory().backView 

Answer 3

lines Aggiungi follwing all'interno del vostro

<ion-navbar hideBackButton="true"> 
    <button (click)="back()" class="back-button disable-hover bar-button bar-button-ios back-button-ios bar-button-default bar-button-default-ios show-back-button" ion-button="bar-button" ng-reflect-klass="back-button" ng-reflect-ng-class="back-button-ios" style=""><span class="button-inner"><ion-icon class="back-button-icon icon icon-ios back-button-icon-ios ion-ios-arrow-back" role="img" ng-reflect-klass="back-button-icon" ng-reflect-ng-class="back-button-icon-ios" aria-label="arrow back" ng-reflect-name="ios-arrow-back"></ion-icon><span class="back-button-text back-button-text-ios" ng-reflect-klass="back-button-text" ng-reflect-ng-class="back-button-text-ios">Back</span></span><div class="button-effect"></div></button>