2016-11-26 7 views
1

私が持っているにつながる項目とion-listNavControllerの子ページの兄弟ページに移動するにはどうすればいいですか?

  • 託児ページA
  • 託児ページB
  • 託児ページC

児童ページBに、私はに移動したい前のページ(子ページA)と次のページ(子ページC)ページに移動し、戻るボタンを親ページに戻します。

この例は、iOSのMailアプリです。メールを表示しているときは、上下の矢印を使って前/次のメールに移動します。

この動作を説明しているドキュメントには何も見つかりませんでした。

注このionic2

答えて

0

この子NAV-バーのためにタグ付けされ

<ion-nav-bar class="bar-light"> 
    <ion-nav-buttons side="left"> 
     <i class="button button-clear button-positive icon ion-android-arrow-back" ng-click="goParent();"></i> 
    </ion-nav-buttons> 
    <ion-nav-buttons side="right"> 
     <button type="submit" class="button button-positive button-clear icon ion-arrow-up-b" ng-click="goPrevious()"></button> 
    </ion-nav-buttons> 
    <ion-nav-buttons side="secondary"> 
     <button type="submit"class="button button-positive button-clear icon ion-arrow-down-b" ng-click="goNext()"></button> 
    </ion-nav-buttons> 
</ion-nav-bar> 

これはapp.js

.state('parent', { 
    url: '/parent', 
    templateUrl: 'templates/parent.html', 
    controller: 'ParentCtrl' 
    }) 

    .state('parent-child', { 
    url: '/parent/child/:mailSerialNumber', 
    templateUrl: 'templates/parent-child.html', 
    controller: 'ChildCtrl' 
    }) 

これは

.controller('ChildCtrl', function ($stateParams, $location, $scope) { 

    $scope.URL = {}; 
    $scope.URL.Parent = "parent" 

    $scope.goParent = function() { 
     $location.url($scope.URL.Parent); 
    }; 

    $scope.Previous = $stateParams.mailSerialNumber - 1; 
    $scope.URL.Previous = "parent/child/" + $scope.Previous; 


    $scope.goPrevious = function() { 
     $location.url($scope.URL.Previous); 
    }; 

    $scope.Next = $stateParams.mailSerialNumber + 1; 
    $scope.URL.Next = "parent/child/" + $scope.Next; 

    $scope.goNext = function() { 
     $location.url($scope.URL.Next); 
    }; 

}) 
+0

ありがとうございました。しかし、質問はイオン2です。 –

1
controller.js

今日は正確に同じ問題を抱えていたし、これをやって、それを解決:

this.navCtrlNavControllerのインスタンスである
// Push the sibling page onto the stack. 
this.navCtrl.push(PageToPush, { fooParam : 'bar' }).then(()=> { 
    // There should be 3 pages in the stack now, and we need to remove the 2nd page (index 1) 
    this.navCtrl.remove(1); 
} 

。これは、ルートページから常にナビゲートし、スタック内に1つの子ページしか保持しないことを前提としています。これがしているのは、新しいページをスタックに押し込むことです(スタック内のインデックス2になります)。そして、ページがプッシュされたら、スタックからインデックス1のページを削除します。

希望に役立ちます。

関連する問題