2015-02-21 9 views
7

Ich habe einige Probleme mit dem ionischen und seinem Verlaufsstapel, wenn ich Seitenmenüs und Tabs verwende.Ionischer Verlaufsstapel bei Verwendung des seitlichen Menüs und der Registerkarten

Ich habe ein Plunker Beispiel hier: http://embed.plnkr.co/XK6seY9mDypTW6GcsCpj/preview

Schritte zu folgen, um das Problem zu erhalten:

  1. Offene Seitenmenü
  2. Navigieren Sie zu "Master List"
  3. Wählen Sie eine der Elemente
  4. Sie werden auf die Registerkarte allgemeine Daten der Detailseite
0 weitergeleitet

Das Problem ist, dass es keine Zurück-Schaltfläche in der Navigation durch ionische selbst angezeigt wird. Ich habe einen eigenen Zurück-Button erstellt, der $ ionicGoBack ($ event) aufruft, um zu sehen, ob ionic den History-Stack hat oder nicht. Aber wenn Sie auf diese Schaltfläche klicken, sehen Sie, dass ionic nicht zur Master-Liste zurückkehrt, sondern Sie bleiben auf der Registerkarte für allgemeine Daten der Detailseite.

Kann mir jemand sagen, was das Problem ist? Ich bin mir bewusst, dass Tabs ihren eigenen History-Stack haben, trotzdem sollte der Tab seinen Vorfahren kennen, oder liege ich falsch?

Vielen Dank im Voraus für Ihre Hilfe!

Mit freundlichen Grüßen

+0

mit dem gleichen Problem. Die Ansicht mit dem Seitenmenü wird nicht zum Verlaufsstapel hinzugefügt. Wenn ich '$ ionicHistory.currentView()' mache, bekomme ich einen Nullwert oder den Wert der vorherigen Ansicht. – cor

Antwort

0

Jedes Ion-tab it's own history stack hat. Wenn du ein Element in der Liste triffst und zu general-data /: id gehst, erstellst du einen neuen Historienstapel - beachte, dass jede Registerkarte ihre eigene ion-nav-Ansicht hat.

Ich habe das schon einmal gemacht, und nur die Tabs css style verwendet und ein ng-klick oder ng-href an jede Registerkarte angehängt und weiterarbeiten aus dem aktuellen History-Stack, und vielleicht Ihre Tab-Leiste als Vorlage verwenden oder eine Richtlinie.

Hoffe, dass hilft!

8

Dies liegt daran, dass die menu-close-Direktive den History-Stack zurücksetzt (wie erklärt here).

Wenn Sie "menu-close" aus Ihren Elementen entfernen, behalten Sie den Verlauf, verlieren aber etwas vom erwarteten Verhalten.

Als eine Lösung können Sie Ihre eigene Direktive entwickeln (sagen wir "menu-close-keep-history"), um die "menu-close" zu ersetzen.

myModule.directive('menuCloseKeepHistory', ['$ionicHistory', function($ionicHistory) { 
    return { 
     restrict: 'AC', 
     link: function($scope, $element) { 
      $element.bind('click', function() { 
       var sideMenuCtrl = $element.inheritedData('$ionSideMenusController'); 
       if (sideMenuCtrl) { 
        $ionicHistory.nextViewOptions({ 
         historyRoot: false, 
         disableAnimate: true, 
         expire: 300 
        }); 
        sideMenuCtrl.close(); 
       } 
      }); 
     } 
    }; 
}]); 

Dies sollte den Trick tun.

+0

Ich sehe keine Verwendung von Menü schließen im Quellcode. Wie würde ich die neue Richtlinie genau anwenden? –

0

Nur ein kleiner Hack, den ich entdeckt habe. Wenn die Registerkarten keinen eigenen Protokollstapel haben sollen. Fügen Sie einfach ein Div über Ihre ionischen Tabs hinzu.

Beispiel:

<div ng-show="vm.loading"> 
    <div style="width: 50px; margin: 0 auto;"> 
    <ion-spinner></ion-spinner> 
    </div> 
</div> 

<ion-tabs data-ng-controller="something as vm" ng-hide="vm.loading"> 
4

Nun, statt individuelle Richtlinie kann man menu-toggle statt menu-close verwenden Wenn Sie

Menü-Toggle

ionische verwenden verfolgt Ihre n aviation history

0

Sie können $ ionicGoBack immer für alle Controller überschreiben und dann eine Standardansicht festlegen, wenn der Historienstapel keine Rückansicht hat.

z.

$rootScope.$ionicGoBack = function() { 
     if($ionicHistory.backView() == null || !angular.isDefined($ionicHistory.backView())){ 
      $state.go("app.default", {});   
     }else{ 
      $ionicHistory.goBack(); 
     } 
    }; 
Verwandte Themen