我之前看到之前的同志用指令.directive連接ionic封裝了“ 'tabs-item-hide'”這個類（屬性），灰常受用，但是在我做項目的時候，用原來的代碼，路由去到另外一個頁面，tab會彈出來（$scope.$on('$destroy',function(){
$rootScope.hideTabs = ' '; }) 這個方法在作怪），但是去掉這個方法後，發現全部頁面都已經沒有tab了
，實際上我相信絕大部分的APP的首頁都是需要tab的，其他頁面可以沒有，下面是我的解決辦法，分享給他家：
一 . 原來代碼：
1.tabs頁面
<ion-tabs class="tabs-icon-top tabs-positie {{hideTabs}}>
...
</ion-tabs>
2.跳轉後頁面
<ion-view hide-tabs>
..
</ion-view>
3. 指令
.directive('hideTabs',function($rootScope){
return {
restrict:'AE',
link:function($scope){
$rootScope.hideTabs = 'tabs-item-hide';
$scope.$on('$destroy',function(){
$rootScope.hideTabs = ' ';
})
}
}
}
二.修改後代碼：
1.tabs頁面
<ion-tabs class="tabs-icon-top tabs-positie {{hideTabs}}{{showTabs}}>
tab1
tab2
.....
</ion-tabs>
2.跳轉後頁面各種views
//需要隱藏的view
<ion-view hide-tabs>
..
</ion-view>
//需要顯示的主頁的view
<ion-view show-tabs>
..
</ion-view>
3. 指令
var app = angular.module("uniApp", ["ionic"]);
app.directive('hideTabs',function($rootScope){
return {
restrict:'AE',
link:function($scope){
$rootScope.hideTabs = 'tabs-item-hide';
//刪除這裏
/*$scope.$on('$destroy',function(){
$rootScope.hideTabs = ' ';
})*/
}
})
//定義顯示tab的showTabs指令
.directive("showTabs", function($rootScope) {
return {
restrict: 'AE',
link: function($scope) {
$rootScope.hideTabs = '';
}
}
})
