积跬步,至千里
精前端,通全栈

Ionic 定制tooltip panel效果实现与RxJS事件绑定对比

App UI图需要实现如下效果:

ionic-tooltip-ui

一开始想通过组件配合指令实现封装成组件,但是时间仓促,只想简单实现达到一样的效果,所以就通过服务来实现。最终效果如下:

tooltip

Code

html

tooltip.service.ts

使用方法

注入服务后,传指定参数即可。

tim 20180124175946

修改为RxJS事件绑定

tooltip.service.ts改为 Observable.fromEvent 方式监听

总结

因为单页面的原因,还是需要考虑解绑事件监听,比较繁琐,对于RxJS处理非同步行为比较方便,可以使用统一的 RxJS API处理。

RxJS相关资源:
https://ithelp.ithome.com.tw/users/20103367/ironman/1199
http://cn.rx.js.org/

赞(0) 打赏
未经允许不得转载:前端学堂 » Ionic 定制tooltip panel效果实现与RxJS事件绑定对比

讨论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

前端实战学习群 学以致用,进步更快

demo演示立即加入

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏