路由結構分析(tabs結構)
//tabs基礎路由.state('tab', { url: '/tab', abstract: true, //設置為基礎路由 templateUrl: 'templates/tabs.html' //也可以加控制器})//首頁路由部分(一級).state('tab.index', { //用于state跳轉,不可重復 url: '/index', //用于url跳轉,或者$location.path('/tab/index'); views: { 'tab-index': { //將這個頁面顯示在tab路由下,與tab.html中name對應 templateUrl: 'templates/index/index.html', controller: 'indexCtrl' } }, cache:false //設置頁面是否緩存})//未接單的訂單詳情頁面(二級).state('tab.orderDetail', { url: '/index/orderDetail/:orderDetailNum', //可以傳遞參數 views: { 'tab-index': { templateUrl: 'templates/index/orderDetail.html', controller: 'orderDetailCtrl' } }, cache:false})路由跳轉的方式
url跳轉<a class="button button-clear" href="#/tab/goods/addDesk" >添加</a> //普通<a href="#/tab/index/orderDetail/{{weixinOrder._id}}"> //傳參控制器中$location.path()$location說明http://www.angularjs.cn/A00M
$location.path('/tab/index');控制器中$state.go() (推薦使用)
$state.go('tab.index', {}, { reload: true});$state.go()跳轉方式
傳遞參數//app.js中確定參數.state('tab.lemoneyCount', { url: '/le/lemoneyCount', params:{method:null,PRoductid:null,rate:null,uprate:null},//先確定參數名 views: { 'tab-le': { templateUrl: 'templates/money/moneyCount.html', controller: 'lemoneyCountCtrl' } }})//控制器中傳遞具體參數$state.go('tab.lemoneyCount', {method:aa,productid:bb,rate:cc,uprate:dd}, { reload: true //下個頁面不緩存 配合路由中cache使用});//下個頁面控制器接收參數.controller('leinvestRecordCtrl', function($stateParams) { var Params = $stateParams; var method = $stateParams.method;});$ionicHistory路由歷史記錄
ionicHistory定義:當用戶通過導航欄切換視圖頁面的時候,ionicHistory起到跟蹤視圖的作用,類似的瀏覽器的行為方式,一個ionic應用程序能夠保持以前的視圖,當前視圖,和前視圖(如果有一個)。然而,一個典型的Web瀏覽器只跟蹤一個歷史堆棧在一個線性的方式。不同于傳統的瀏覽器環境中,應用程序和應用程序并行的獨立的歷史,如標簽。如果一個用戶在一個標簽上瀏覽幾頁,然后切換到一個新的標簽和回退,返回按鈕與以前的標簽,但到以前的頁面訪問在該標簽。因為ionicHistory有利于并行歷史架構。?varhistoryData=ionicHistory.viewHistory();
返回該應用程序的視圖歷史數據,如所有的視圖和歷史記錄,以及它們如何在導航堆棧中一起有序和鏈接的方式 - var currentViewData=$ionicHistory.currentView()
返回當前視圖數據 - var currentHistoryId = $ionicHistory.currentHistoryId()
返回歷史堆棧的標識,它是當前視圖的父容器 - var currentTitle = $ionicHistory.currentTitlt([val])
返回當前視圖的標題 或者是設置當前視圖的標題 - var backView = $ionicHistory.backView()
返回當前視圖的前一個視圖 - var backViewTitle = $ionicHistory.backViewTitle()
返回當前視圖的前一個視圖的標題 - var forwardView = $ionicHistory.forwardView()
返回當前視圖后一個視圖數據 (如果有) - var currentStateName = $ionicHistory.currentStateName()
返回當前視圖的狀態名稱 如tab.sal - $ionicHistory.goBack([backCount])
導航到應用程序的返回視圖(加入視圖存在)backCount填寫負數 - $ionicHistory.removeBackView()
移除當前視圖的前一個視圖,包括緩存元素和范圍(如果它們存在的話)。 - $ionicHistory.clearHistory()
清除應用程序的整個歷史,除了當前視圖。 - var promise = $ionicHistory.clearCache(stateIds)
清除緩存,傳入參數,stateIds是一個數組,清除緩存的列表
$ionicHistory.nextViewOptions({ disableAnimate: true, disableBack: true,historyRoot:true});目前使用中的小問題
問題1
描述:當想從一個tab下的頁面 跳到另外一個tab下的頁面時,后退按鈕不能顯示。
暫時解決辦法:在兩個tab下都寫這個頁面的路由,公用頁面控制器。
問題2
描述:后退按鈕不能正常顯示。
暫時解決辦法:無