ionic開發中頁面跳轉隱藏ion-tabs__ionic

情境描述：

點擊測試裝置1跳轉到裝置詳情頁，在裝置詳情頁隱藏底部的標題列ion-tabs，當頁面從裝置詳情頁返回到首頁時，顯示底部標題列。

具體步驟：

1.在ion-tabs後添加

ng-class="{'tabs-item-hide': $root.hideTabs}"

2.在app.js中添加

.directive('showTabs', function ($rootScope) {  return {    restrict: 'A',    link: function ($scope, $el) {      $rootScope.hideTabs = false;    }  };}).directive('hideTabs', function ($rootScope) {  return {    restrict: 'A',    link: function ($scope, $el) {      $rootScope.hideTabs = true;    }  };})

3.隱藏，在裝置詳情頁中的ion-view後添加

hide-tabs

4.顯示，在首頁的控制器中添加

$scope.$on('$ionicView.enter', function () {    // 顯示 tabs    $rootScope.hideTabs = false;})

注意：此處要在function後添加$rootScope，代碼如下

.controller('homeController',function($scope,$rootScope){    $scope.title='首頁'    $scope.items = [];    for(var i=0;i<10;i++)        $scope.items.push(["測試裝置 ",i+1].join(""))    $scope.$on('$ionicView.enter', function () {        // 顯示 tabs        $rootScope.hideTabs = false;    })})

這樣就實現了上述情境描述中的功能。

由於剛開始接觸ionic開發，很多東西還不是很懂，說的有些墨跡，見諒...

參考網址：http://www.cnblogs.com/maoyazhi/p/4424039.html