安装:

npm install --save eventemitter3

创建event.service

import { Injectable } from '@angular/core';

// var EventEmitter = require('eventemitter3');

import { EventEmitter } from 'eventemitter3';

@Injectable({
providedIn: 'root'
})
export class EventService { public event:any; constructor() { this.event=new EventEmitter(); //这个实例就会被多个组件共享 来实现不同页面的数据通信
}
}

使用

比如登陆成功后,更新个人中心页面数据:

登陆页面,引入事件服务:

在登陆成功后发布事件:

      //通知用户中心更新用户信息
this.eventService.event.emit('useraction');

个人中心监听事件:

ngOnInit() {

    //监听注册 登录成功的事件
this.eventService.event.on('useraction',()=>{
var userinfo=this.storage.get('userinfo');
if(userinfo && userinfo.username){
this.userinfo=userinfo;
}else{
this.userinfo='';
} }) }

ionic4.x EventEmitter3的使用的更多相关文章

  1. ionic4 混合移动开发 (前世今生)

    ionic 从2016年初识,经历了 ionic2 ionic3.至今 ionic4,终于在2018年7月份发布了测试版. ionic Framework 可以说得上是最接近原生app的ui组件,漂亮 ...

  2. ionic4 开发企业微信应用0

    作为一个后台开发人员,几年前参与过Ionic1开发过一微信公众号的经历,所以这次开发企业微信应用,就使用了ionic,正好ionic4 rc版本发布,虽然不是正式版,作为本项目的项目经理,还是决定使用 ...

  3. ionic4+angular6 混合移动开发 capacitor cordova

    首先要更新或者安装 ionic cli npm install -g ionic 创建项目 ionic start ionic-angular tabs --type=angular –type=an ...

  4. 基于ionic4、cordova搭建android开发环境

    前颜(yan)最近公司有一个项目需求是利用h5进行跨平台开发,这里所说的跨平台开发指的是:将h5代码利用某种方式或工具环境进行打包,最后生成android的apk以及ios的ipa. 本文只讲解and ...

  5. vue引用ionic4

    现在的Ionic4已经开始支持VUE和REACT了.个人之前开发用IONIC.现在用VUE开发还是想用IONIC.刚好 也是支持VUE了. 在vue的项目里安装ionic依赖 npm install ...

  6. 使用Genymotion模拟器或者手机运行ionic4程序

    1.使用命令行 #添加android, 如果是ios ,设置ioscordova platform add android #编译成apkionic build #开启cordova run andr ...

  7. ionic4 ios调试打包

    在ionic3的时候打包上架过ios的版本,等到今天,差不多一年左右过去.做了个ionic4的app要测试打包的时候,才发现以前的东西忘的差不多了.不得不从头再来一遍,所幸的是这次看见了很多好的文章, ...

  8. ionic4打包和ngix配置

    ionic4打包 ng run app:build --base-href=/edu/course/mobile压缩打包 ng run app:build:production --base-href ...

  9. ionic4 路由跳转、ionic4 路由跳转传值 NavController 返回上一页 、NavController 回到根

    1.普通路由跳转 <ion-button [routerLink]="['/pinfo']"> 跳转到详情 </ion-button> <ion-he ...

随机推荐

  1. h5中history实例

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. 浅谈CopyOnWriteArraySet

    CopyOnWriteArraySet结构图   CopyOnWriteArraySet.png CopyOnWriteArraySet主要方法 public boolean add(E e); pu ...

  3. 让Jupyter Notebook个性化

    Win下更改jupyter主题 Themes地址 本人环境  Win+Conda 开始使用pip 安装,发现无法使用pip,修改环境变量,将D:\Program Files\Conda\Scripts ...

  4. 51nod 2497 数三角形

    小b有一个仅包含非负整数的数组a,她想知道有多少个三元组(i,j,k),满足i<j<k且a[i],a[j],a[k]可能作为某个三角形的三条边的边长. 收起   输入 第一行输入一个正整数 ...

  5. mysql-proxy读写分离笔记

    1.MySQL的安装与配置 --省略 版本:Server version: 5.6.35 1.1 系统版本: [root@centos7-67 package]# lsb_release -a LSB ...

  6. vue-cli 3 按需引入 element-ui

    1.安装按需引入必要插件 npm install babel-plugin-component --save-dev 2.修改babel.config.js 3.在main.js中引入用到的组件,例如 ...

  7. 行为型模式(十) 备忘录模式(Memento)

    一.动机(Motivate) 我们看上图,一个对象肯定会有很多状态,这些状态肯定会相互转变而促进对象的发展,如果要想在某一时刻把当前对象回复到以前某一时刻的状态,这个情况用"备忘录模式&qu ...

  8. 做vue项目时,收集的一些有意思的功能

    1. element-ui dialog组件添加可拖拽位置 可拖拽宽高 https://segmentfault.com/a/1190000012940145

  9. c++的动态绑定和静态绑定及多态的实现原理(摘)

    C++多态的实现原理 为了支持c++的多态性,才用了动态绑定和静态绑定.理解它们的区别有助于更好的理解多态性,以及在编程的过程中避免犯错误. 需要理解四个名词:对象的静态类型:对象在声明时采用的类型. ...

  10. Flume源码更改

    1.源码更改场景:如果使用 0.8 版本 Kafka 并配套 1.6 版本 Flume,由于 Flume 1.6 版本没有Taildir Source 组件,因此,需要将 Flume 1.7 中的 T ...