ionicはion-tabsを隠して遅延問題を解決する(tabs)


ネット上にはion-tabsを隠すブログがたくさんありますが、大体の方法はangularjsコマンドを追加することです.
しかし,隠蔽時の遅延問題の解決には言及されなかった.
隠し方について説明します
  • ラベルion-tabsに:ng-class="{‘tabs-item-hide’:$root.hideTabs}"を追加し、ソースコードは以下の通り:
  • <ion-tabs class="tabs-icon-top" ng-class="{'tabs-item-hide': $root.hideTabs}">
    
    //tabs
    
    </ion-tabs>
    1 2 3 4 5
    2.angularjsのコマンドを追加します.ソースコードは次のとおりです.
    //app          , var app = angular.module("starter",["ionic"])
    app.directive('hideTabs', function($rootScope) {
        return {
            restrict: 'A',
            link: function(scope, element, attributes) {
                scope.$on('$ionicView.beforeEnter', function() {
                    scope.$watch(attributes.hideTabs, function(value){
                        $rootScope.hideTabs = value;
                    });
                });
    
                scope.$on('$ionicView.beforeLeave', function() {
                    $rootScope.hideTabs = false;
                });
            }
        };
    });
    1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17
    3.3隠したいインタフェースラベルion-view式hide-tabs="true"を追加します.ソースコードは次のとおりです.
    //          
    <ion-view hide-tabs="true" view-title="{{chat.name}}">
    
      <ion-content class="padding">
    
        <img ng-src="{{chat.face}}" style="width: 64px; height: 64px">
        <p>
          {{chat.lastText}}
        p>
      ion-content>
    ion-view>
    以上の3ステップでtabsを隠すことができますが、tabsが正常に隠すことに気づきます.
    ion-contentには本当のフルスクリーンはありません.
    レビュー要素を使用すると、ion-contentのclassにhas-tabsがあり、has-tabsを削除すれば問題ありません.
    実はこの問題を解決するのは簡単です.tabsを隠すときに$scope.$hasTabsプロパティはfalseに設定されています(ここでは、前はくだらない話です...)
      $scope.$hasTabs = false;