美文网首页Web 前端开发
ionic-tab的隐藏与显示

ionic-tab的隐藏与显示

作者: krock01 | 来源:发表于2016-06-01 11:13 被阅读3027次

在网上看到有人用ionic模仿微信写demo,我自己也尝试了下,期间遇到一些问题,特此记录一下

问题描述:

微信会话列表与单个会话在切换的时候需要显示和隐藏tabbar

解决办法:

在网上搜索到一个解决方案,是通过自定义一个指令和全局变量来实现切换的,所以具体实现办法见解决办法1

因为自己不怎么喜欢重复造轮子,所以查看了ionic api之后发现了ionic本身提供了tabs的操作委托对象,通过在controller中添加监听直接通过ionic的提供的委托$ionicTabsDelegate来实现,见下面代码实现

此代码是在ionic demo的基础上实现的,所以这里只提供关键代码

//因为ionic在app.js中已经引入,所以这里可以直接注入$ionicTabsDelegate
app.controller('ChatDetailCtrl', 
function($scope,$stateParams, Chats,$ionicTabsDelegate) {
    $scope.chat = Chats.get($stateParams.chatId);
    //在此作用域下绑定监听ionic视图在进入之前的事件
    $scope.$on('$ionicView.beforeEnter', function() {
      //关闭tab选项卡      
      $ionicTabsDelegate.showBar(false);    
});  
    //在此作用域下绑定监听ionic视图在离开之前的事件  
    $scope.$on('$ionicView.beforeLeave', function() {
      //打开tab选项卡      
      $ionicTabsDelegate.showBar(true);    
});
});

相关文章

  • ionic-tab的隐藏与显示

    在网上看到有人用ionic模仿微信写demo,我自己也尝试了下,期间遇到一些问题,特此记录一下 问题描述: 微信会...

  • 04-jQuery动效

    jQuery效果 显示与隐藏动画 显示 show([speed,[easing],[fn]); 隐藏 hide([...

  • iOS开发第三方库UI-swift版

    | 隐藏与显示||

  • jQuery(二)

    jQuery效果 隐藏与显示 隐藏效果,1000ms后隐藏 显示效果show(),1000ms后显示 toggle...

  • jQuery动画方法

    隐藏与显示 hide(speed,callback)show(speed,callback) 隐藏和显示 spee...

  • 显示与隐藏

  • 显示与隐藏

    在线咨询 姓名: 手机号码: 案情:

  • CSS-高级技巧

    1. 元素的显示与隐藏 ① display 显示 display 设置元素是否及如何显示。 特点:隐藏之后,不再保...

  • 《HTML控制DIV的显示与隐藏》

    《HTML控制DIV的显示与隐藏》 通过JS控制DIV的显示和隐藏。具体代码如下:

  • jQuery-动效

    jQuery显示与隐藏 show([speed,[easing],[fn]])显示隐藏的匹配元素内部的实现原理是根...

网友评论

    本文标题:ionic-tab的隐藏与显示

    本文链接:https://www.haomeiwen.com/subject/cbkcdttx.html