hiding back button in ionic, angularjs

Ho bisogno di mostrare e nascondere il pulsante indietro in diverse pagine/viste. Presi di riferimento da Justin Noel:hiding back button in ionic, angularjs

<body ng-app="starter" ng-controller="AppCtrl"> 
    <ion-nav-bar class="bar-stable"> 
    <ion-nav-back-button hide-back-button="{{hideBackButton}}"> 
    </ion-nav-back-button> 
    </ion-nav-bar> 
</body>

Controller App per attivare o disattivare visualizzazione dei pulsanti:

.controller('AppCtrl', function($scope, $location) { 
    var path = $location.path(); 
    if (path.indexOf('submit') != -1) 
    $scope.hideBackButton = true; 
    else 
    $scope.hideBackButton = false; 
})

Ma questo non funziona come controller è chiamato solo una volta, ma non al cambiamento di vista in diversi stati. Anche la modifica del valore di $ scope.hideBackButton da altri controller (collegati a stati diversi) non ha alcun effetto sulla visualizzazione del pulsante.

Qualcuno può dirmi come attivare la visualizzazione del pulsante di ritorno su ogni navigazione. Cosa mi manca qui?

fonte

2015-02-04 vikramaditya234

Ho avuto esattamente lo stesso problema di oggi.

soluzione

più semplice è quello di utilizzare $ ionicNavBarDelegate:

.controller('AppCtrl', function($scope, $location, $ionicNavBarDelegate) { 
    var path = $location.path(); 
    if (path.indexOf('submit') != -1) 
    $ionicNavBarDelegate.showBackButton(false); 
    else 
    $ionicNavBarDelegate.showBackButton(true); 
})

Si può anche avvolgere il valore hideBackButton in oggetto e il codice funzionerà:

.controller('AppCtrl', function($scope, $location) { 
    var path = $location.path(); 
    $scope.options = $scope.options || {}; 
    if (path.indexOf('submit') != -1) 
    $scope.options.hideBackButton = true; 
    else 
    $scope.options.hideBackButton = false; 
})

Funziona perché in JS (come in molti altri lingue) i valori booleani vengono passati per valore e l'oggetto viene passato dal riferimento e influisce sul modo in cui vengono creati osservatori angolari predefiniti. Lo svantaggio di questo metodo è che nascondere il pulsante non è così semplice come in altre soluzioni ioniche.

Solo nel caso, questo è come il vostro html dovrebbe essere simile:

prima soluzione:

<body ng-app="starter" ng-controller="AppCtrl"> 
    <ion-nav-bar class="bar-stable"> 
    <ion-nav-back-button> 
    </ion-nav-back-button> 
    </ion-nav-bar> 
</body>

seconda soluzione:

<body ng-app="starter" ng-controller="AppCtrl"> 
    <ion-nav-bar class="bar-stable"> 
    <ion-nav-back-button hide-back-button="{{options.hideBackButton}}"> 
    </ion-nav-back-button> 
    </ion-nav-bar> 
</body>

fonte

2015-03-03 11:11:15 Vees

Per me ha funzionato solo l'aggiunta the-back-pulsante di nascondere sul cartellino di ioni-vista, come su questo codepen: http://codepen.io/calendee/pen/ eusfl – gmartini20

È possibile modificare le impostazioni della cache in modo che quando la pagina viene ricaricata il controller è chiamato di nuovo: http://ionicframework.com/docs/api/directive/ionNavView/

fonte

2015-02-06 10:12:32 Toxus

$ionicHistory.nextViewOptions({ 
    disableBack: true 
    }); 

    $state.go('app.home');

fonte

2015-04-07 11:09:22 BratisLatas

$ ionicViewService è obsoleto. Usa $ ionicHistory.nextViewOptions – BratisLatas

Questa è la soluzione che funziona davvero. –

Anche io confermo, questa soluzione funziona! –

L'attributo hide-back-button su <ion-view> ha fatto il trucco per me: <ion-view hide-back-button="true">

Vedere la documentazione ufficiale here.

fonte

2015-06-19 00:00:48 nfgf

La soluzione migliore se si desidera semplicemente nascondere il pulsante Indietro senza alcuna condizione. Grazie. –

Un modo molto semplice per ottenere ciò è applicare la direttiva menu-close al pulsante/ancoraggio. Tecnicamente è pensato per chiudere il menu, ma puoi usarlo su qualsiasi link e ignorerà l'animazione della diapositiva. & non mostrerà il pulsante Indietro.

<a menu-close href="#/home">Home</a>

http://ionicframework.com/docs/api/directive/menuClose/

fonte

2015-07-21 06:59:03

Funziona con ui-sref e ng-clic? – Justin

Funziona con ui-sref, ma 'menu-close' cancella in realtà la cronologia, ecco perché non vedi il pulsante Indietro (nessun back-state). Penso che la risposta di nfgf sia migliore. –

L'attributo hide-back-button deve essere impostato su ion-view tag.

fonte

2016-07-05 15:57:24

$ionicHistory.nextViewOptions({ 
      disableBack: false, 
      historyRoot: true 
     });

Questa sembra una buona opzione da utilizzare, funziona bene per me.

fonte

2016-10-13 11:48:19

ionico 2 & 3: <ion-navbar [hideBackButton]="true">

fonte

2018-01-09 06:59:19 TaeKwonJoe

il suo lavoro per me – core114

hiding back button in ionic, angularjs

risposta

Problemi correlati