この記事では、参照用のイオン隠蔽タブの方法を共有しています。特定のコンテンツは次のとおりです
1。
<ion-tabs ng-class = "{'tabs-item-hide':$ root.hidetabs}"> <! - tabs-> </ion-tabs>2。
このコントローラーに指向性を追加します。
var module = angular.module( 'app.directives'、[]); module.direction( 'showtabs'、function($ rootscope){return {restrict: 'a'、link:function($ scope、$ el){$ rootscope.hidetabs = fals;};};})。制限: 'a'、link:function($ scope、$ el){$ rootscope.hidetabs = true;})3。
HTMLページの隠しタブを参照してください
<ion-view hide-tabs> <! - コンテンツを表示 - > </ion-tabs>
4。
ページがメインページに戻ると、タブを再度表示する必要があり、コントローラーに追加する必要があります(主にタブの問題を解決するか、Androidで非表示になります):
$ scope。$ on( '$ ionicview.enter'、function(){// tabs $ rootscope.hidetabs = false;});5。
私はTabs-Topを使用していますが、遭遇したもう1つの問題は次のとおりです。解決:
Directive.jsのコンテンツをもう一度変更すると、showtabsを使用しなくなりました。
.directive( 'hidetabs'、function($ rootscope){return {restrict: 'a'、link:function(scope、element、actributes){scope。$ on( '$ ionicview.beforenter'、function(){scope。$ watch(absibutes.hidetabs、(value){$ rootscope.hidetabs; scope。$ on( '$ ionicview.beforeleave'、function(){$ rootscope.hidetabs = false;};};})要約しましょう。タブの使用法と比較して、下部にある場合、上記のタブに大きな問題はありません。しかし、それが上部で使用されている場合、コンテンツに関してはいくつかの問題が発生します。
実際、<イオンタブ>の代わりにイオンに<イオンスライド>を使用することを検討できます。他のページのスライド効果であろうと、スライドページのスライド効果であろうと、特にAndroidで大幅に改善されます。
上記はこの記事のすべての内容です。みんなの学習に役立つことを願っています。誰もがwulin.comをもっとサポートすることを願っています。