AngularJS Force Back Button Route

Question

私の戻るボタンは、私のアプリケーションの最初のページ/状態（cadastreSe）に私を送ります。ボタンid = "temporada2016-button3"をアクティブにして、前のページ/状態（ 'menu.temporada2016'）に戻るにはどうすればよいですか？ angularjsで可能ですか？

$スコープでそれを可能にするために私の帽子は$（ '$ ionicView.beforeEnter' に関する...

状態：。

angular.module('app.routes', []) 

.config(function($stateProvider, $urlRouterProvider) { 

$stateProvider 


.state('menu.temporada2016', { 
cache: false, 
url: '/page1', 
views: { 
    'side-menu21': { 
    templateUrl: 'templates/temporada2016.html', 
    controller: 'temporada2016Ctrl', 
    params: { dataToTemp: false }   
    } 
} 
}) 

.state('menu.fotos', { 
url: '/page2', 
views: { 
    'side-menu21': { 
    templateUrl: 'templates/fotos.html', 
    controller: 'fotosCtrl' 
    } 
} 
}) 

.state('menu.configuraEs', { 
url: '/page3', 
views: { 
    'side-menu21': { 
    templateUrl: 'templates/configuraEs.html', 
    controller: 'configuraEsCtrl' 
    } 
} 
}) 

.state('menu', { 
url: '/side-menu21', 
templateUrl: 'templates/menu.html', 
abstract:true 
}) 

.state('detalhes', { 
cache: false, 
url: '/page4', 
params: { 
    dataToDetails: false 
}, 
templateUrl: 'templates/detalhes.html', 
controller: 'detalhesCtrl' 
}) 

.state('cadastreSe', { 
url: '/page5', 
templateUrl: 'templates/cadastreSe.html', 
controller: 'cadastreSeCtrl' 
}) 

.state('home', { 
url: '/page6', 
templateUrl: 'templates/home.html', 
controller: 'homeCtrl' 
}) 

.state('suporte', { 
url: '/page7', 
templateUrl: 'templates/suporte.html', 
controller: 'suporteCtrl' 
}) 

.state('fotos2', { 
url: '/page8', 
templateUrl: 'templates/fotos2.html', 
controller: 'fotos2Ctrl', 
params: { 
    dataToFotos: false 
} 
}) 

$urlRouterProvider.otherwise('/page5') 



}); 

はコントローラ：

.controller('fotos2Ctrl', ['$scope', '$state', '$ionicModal', '$ionicSlideBoxDelegate', '$ionicScrollDelegate', function ($scope, $state, $ionicModal, $ionicSlideBoxDelegate, $ionicScrollDelegate) { 

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

$scope.$on('$routeChangeSuccess', function(event, current, previous){ 


}); 

if(!$state.params.dataToFotos) { 
    console.log($state.params.dataToFotos); 

}else{ 

    console.log($state.params.dataToFotos); 
    $scope.images = $state.params.dataToFotos.album;   
} 

$scope.zoomMin = 1; 

// image gallery 
$scope.showImages = function(index) { 
    $scope.activeSlide = index; 
    $scope.showModal('templates/popover.html'); 
} 

$scope.showModal = function(templateUrl) { 
    $ionicModal.fromTemplateUrl(templateUrl, { 
     scope: $scope, 
     animation: 'slide-in-up' 
    }).then(function(modal) { 
     $scope.modal = modal; 
     $scope.modal.show(); 
    }); 
} 

// Close the modal 
$scope.closeModal = function() { 
    $scope.modal.hide(); 
    $scope.modal.remove() 
}; 

$scope.updateSlideStatus = function(slide) { 

    var zoomFactor = $ionicScrollDelegate.$getByHandle('scrollHandle' + slide).getScrollPosition().zoom; 

    if (zoomFactor == $scope.zoomMin) { 
     $ionicSlideBoxDelegate.enableSlide(true); 
    } else { 
     $ionicSlideBoxDelegate.enableSlide(false); 
    } 
}; 

}]) 

fotos2.html

<ion-view title="Fotos ..." id="page8" style="background-color:#FFFFFF;"> 
<ion-content padding="true" class="has-header"> 
    <!--<div class="row responsive-md"> 
     <div class="col col-25" ng-repeat="image in images"> 
      <img ng-src="http://localhost/dashboard/{{image.FILE}}" width="100%" /> 
     </div> 
    </div>--> 
    <div class="row" ng-repeat="image in images" ng-if="$index % 4 === 0"> 
     <div class="col col-25" ng-if="$index < images.length"> 
      <img class="grid-thumb" ng-src="http://localhost/dashboard/{{images[$index].FILE}}" width="100%" ng-click="showImages($index)" /> 
     </div> 
     <div class="col col-25" ng-if="$index + 1 < images.length"> 
      <img class="grid-thumb" ng-src="http://localhost/dashboard/{{images[$index + 1].FILE}}" width="100%" ng-click="showImages($index+1)" /> 
     </div> 
     <div class="col col-25" ng-if="$index + 2 < images.length"> 
      <img class="grid-thumb" ng-src="http://localhost/dashboard/{{images[$index + 2].FILE}}" width="100%" ng-click="showImages($index+2)" /> 
     </div> 
     <div class="col col-25" ng-if="$index + 3 < images.length"> 
      <img class="grid-thumb" ng-src="http://localhost/dashboard/{{images[$index + 3].FILE}}" width="100%" ng-click="showImages($index+3)" /> 
     </div> 
    </div> 
</ion-content> 
</ion-view> 

temporada2016.html

<ion-view title="Temporada 2016" id="page1" style="background-color:#FFFFFF;"> 
<ion-content padding="true" class="has-header"> 
    <div id="temporada2016-button-bar1" class="button-bar"> 
     <button id="temporada2016-button2" style="color:#008BBB;" class="button button-light button-block button-outline" ng-class="{active_news_btn: active_news_btn}" ng-click="activate_news()">Notícias</button> 
     <button id="temporada2016-button3" style="color:#008BBB;" class="button button-light button-block button-outline" ng-class="{active_albums_btn: active_albums_btn}" ng-click="activate_albums()">Fotos</button> 
    </div> 

    <form id="temporada2016-form8" class="list" ng-show="search_news"> 
     <label class="item item-input" name="search_news"> 
      <i class="icon ion-search placeholder-icon"></i> 
      <input type="search" placeholder="Pesquisar Notícia" ng-model="searchNews"> 
     </label> 
    </form> 

    <div class="item item-body list-container" id="temporada2016-list-item-container4" ng-model="item_id" ng-repeat="x in items | filter:searchNews" item="x" href="#/x/{{x.ID}}" ng-click="open_item(x)" ng-show="news_list"> 

     <div id="temporada2016-markdown7" style="margin-top:0px;color:#666666;"> 
      <h2 style="color:#008BBB;">{{ x.TITLE }}</h2> 
     </div> 

    </div> 


    <!--<ion-list class="widget uib_w_1 d-margins" data-uib="ionic/list" data-ver="0"> 
     <ion-item class="item widget uib_w_2" data-uib="ionic/list_item" data-ver="0" ng-repeat="x in items">{{ x.TITLE }}</ion-item> 
    </ion-list>--> 

    <ion-list id="fotos-list4" ng-show="albums_list"> 
     <ion-item class="item-icon-left item-icon-right calm" id="fotos-list-item4" ng-model="album_name" ng-repeat="item in albums" item="item" href="#/item/{{item.FOLDER}}" ng-click="open_album(item)"> 
      <i class="icon ion-images"></i> 
       {{item.FOLDER}} 
      <i class="icon ion-ios-arrow-forward"></i> 
     </ion-item> 
    </ion-list> 
</ion-content> 
</ion-view> 

index.htmlを

<body ng-app="app" animation="slide-left-right-ios7"> 
<div> 
    <div> 
    <ion-nav-bar class="bar-calm"> 
     <ion-nav-back-button class="button-icon icon ion-ios-arrow-back"></ion-nav-back-button> 
    </ion-nav-bar> 
    <ion-nav-view></ion-nav-view> 
    </div> 
    </div> 
</body> 

Answer 1

あなたは、特定のビューのテンプレートに新しいものを追加することで、特定のページのヘッダーを上書きすることができます。それはタグの外側であっても上であってもよい。単にあなたの通常のヘッダーを反映させるだけです。正確に同じように見えるバックボタンを実装しますが、ng-clickイベントをトリガーさせてから、そのユーザーに戻るために$ state.go ）または$ ionicHistoryの依存関係を使ってナビゲーションスタックをナビゲートすることによって実現できます。