Ionic2 rc2 Events 跨界面调用的使用方法及问题解决

时间:2022-05-30 22:02:13

Events:事件注册  在任意一界面注册事件之后可在任意界面根据事件名称进行调用。

首先看一下官方文档的调用方式

import { Events } from 'ionic-angular';

constructor(public events: Events) {}

// first page (publish an event when a user is created)
function createUser(user) {
console.log('User created!')
events.publish('user:created', user, Date.now());
} // second page (listen for the user created event)
events.subscribe('user:created', (user, time) => {
// user and time are the same arguments passed in `events.publish(user, time)`
console.log('Welcome', user, 'at', time);
});

Events 有三个方法 分别是:

this.events.publish ()        //注册Events事件
this.events.subscribe() //调用Eevents事件
this.events.unsubscribe() //注销Events事件

使用实例:

Ionic2 升级Rc版之后,在Tabs的Menu页调用Push事件跳转到首页的时候下面的菜单还是存在的,这样明显是不正常的。

解决办法1:登录页自动隐藏Tabs菜单。

解决办法2:在Tabs中注册一个返回登录页得Events事件,通过Events返回首页。

登录页的自动隐藏下次在记录。我们现在采用最简单的方式 第二个办法。

Tabs界面代码:


constructor(private nav: NavController, private events: Events) {
// this tells the tabs component which Pages
// should be each tab's root Page

}

ionViewDidLoad() {
this.listenEvents();
//console.log('界面创建');
}
ionViewWillUnload() {
//console.log('界面销毁');this.events.unsubscribe('toLogin');
} listenEvents() {this.events.subscribe('toLogin', () => {
this.nav.pop();
console.log('返回登录');
});
}
退出界面调用调用代码
  logOut() {
this.event.publish('toLogin');
}
注:界面每次调用Push是会就是触发ionViewDidLoad事件,调用Pop的时候则会销毁界面,调用ionViewWillUnload。

所以注册Events事件的时候必须在界面销毁的时候把事件进行注销,不然下次调用则会重复执行Events中的注册的方法。

Ionic2 rc2 Events 跨界面调用的使用方法及问题解决的更多相关文章

  1. WPF 跨界面调用程序

    this.Dispatcher.BeginInvoke(DispatcherPriority.Normal, (System.Threading.ThreadStart)delegate() { sE ...

  2. 跨域调用接口的方法之一:$.ajaxSetup()

    跨域查询接口的数据,之前在公司时有发生过,产生的原因是,本地请求的域名或IP地址不一致,解除方法,也是修改域名和IP地址.比如: 接口中的数据来自IP地址:192.168.1.23/get.php 如 ...

  3. iframe 跨域调用父级方法的方案

    一.如果高层域名相同的话,可以通过document.domain来实现跨域访问 例如: 父级域名:localhost:8080 子级域名:localhost:9090 那么可以设置document.d ...

  4. jquery Ajax跨域调用WebServices方法

    由于公司需要开发一个手机页面,想提供给同事直接在手机上可以查询SAP资料.数据需要使用js调用webserver来获取. 因为初次使用Jquery调用Webserver,所以期间并不顺利.测试调用We ...

  5. C# 跨线程调用问题

    纠结了好久,终于知道了winform和WPF的UI的跨线程调用的解决方法: winform下如果为了省事,可以直接禁用跨线程检查: Control.CheckForIllegalCrossThread ...

  6. ThinkPHP实现跨模块调用操作方法概述

    ThinkPHP实现跨模块调用操作方法概述 投稿:shichen2014 字体:[增加 减小] 类型:转载   使用 $this 可以调用当前模块内的方法,但是很多情况下经常会在当前模块中调用其他模块 ...

  7. ThinkPHP 跨模块调用操作方法(A方法与R方法)

    ThinkPHP 跨模块调用操作方法(A方法与R方法) 跨模块调用操作方法 前面说了可以使用 $this 来调用当前模块内的方法,但实际情况中还经常会在当前模块调用其他模块的方法.ThinkPHP 内 ...

  8. Android--绑定服务调用服务的方法

    Service依照其启动的方式,可分为两种: 1.Started Started的Service.通过在Application里用startService(Intent intent)方法来启动.这样 ...

  9. C# 跨线程调用控件

    在C# 的应用程序开发中, 我们经常要把UI线程和工作线程分开,防止界面停止响应.  同时我们又需要在工作线程中更新UI界面上的控件, 下面介绍几种常用的方法 阅读目录 线程间操作无效 第一种办法:禁 ...

随机推荐

  1. 离线pip下载Python包

    离线pip下载Python包   这几天搞Windows离线断网环境下安装Python包,配置环境,各种坑!做个记录,供以后查询吧.      # 生产环境  windows xp# python 2 ...

  2. Oracle监听小问题

    啥情况 宁波_弈风 15:17:40   宁波_弈风 15:17:49 默认配置路径 宁波_弈风 15:18:09   宁波_弈风 15:19:13 我原来一直都在SAMPLE文件里面配置和保存,因为 ...

  3. 经典设计:30个另类的 404 not found 页面设计

    404页面是每个网站必不可少的一部分.我们在网络上能看到很多创意的404错误页面.在这篇文章中,我挑选了30个充满灵感和启发性的404页面设计的例子.Web 设计师们花精力设计一个另类的自定义的404 ...

  4. ajax学习计划

    来自http://segmentfault.com/a/1190000004322487?utm_source=Weibo&utm_medium=shareLink&utm_campa ...

  5. ios入门之c语言篇——基本函数——2——判断闰年

    2.闰年判断 参数返回值解析: 参数: a:int,年份: 返回值: 1:闰年: 0:非闰年: int leapyear(int a) { ==) { ; } ==) { ; } ==) { ; } ...

  6. 基于Struts2的SpringMVC入门

    1.SpringMVC概述 (1)SpringMVC为表现层提供基础的基于MVC设计理念的优秀Web框架, (2)SpringMVC通过一套mvc的注解,让POJO成为处理请求的控制器,而无需任何接口 ...

  7. js中的数组去重

    var str=["1","4","5","5","6","1","7 ...

  8. Eclipse字体最好

    改变字体 windows->Preferences->General->Appearance->Colors and Fonts 右边选择Java ->Java Edit ...

  9. prufer序列计数的一些结论

    \(prufer\)序列和完全图的生成树一一对应(考虑构造) 完全图的生成树个数为\(n^{n - 2}\) 满足第\(i\)个点的度数为\(d_i\)的生成树为\(\frac{n!}{\prod ( ...

  10. 求矩形的周长(线段树+扫描线) Picture POJ - 1177

    题目链接:https://cn.vjudge.net/problem/POJ-1177 题目大意:求矩形外部的周长 具体思路:借用一下bin巨的一张图片. 我们按照y周从下往上的扫描线进行扫描,第一下 ...