ionic2+Angular ionScroll页面滑动监听

时间:2021-12-01 23:05:31

第一:需要在组件中引入相关模块;

ionic2+Angular  ionScroll页面滑动监听

第二:如果只是监听页面滑动,只需要标注@ViewChild(Content) content: Content;就可以了。

ionic2+Angular  ionScroll页面滑动监听

附加:如果要监听页面的某个元素,并对其进行操作的话,在html文件中如下标记即可:

ionic2+Angular  ionScroll页面滑动监听

第三:在组件加载完成的方法之内,对页面的滑动进行监听;

ionic2+Angular  ionScroll页面滑动监听

注意:如果在页面滑动过程中对数据进行修改,页面是不会重构的。所以在对应的操作中需要使用如下方法,使页面能够重构。

ionic2+Angular  ionScroll页面滑动监听

补充:#标记的元素读取方式似乎与标记的元素有关,例如:如下的标记元素使用上边提到的方法就无法获取。

ionic2+Angular  ionScroll页面滑动监听

ionic2+Angular  ionScroll页面滑动监听

补充:获取页面元素的方式Android系统和iOS系统不一样;but:

谨记不要试图直接去操作页面元素,例如我改变页面某个元素的样式,其实可以通过其他方法达到同样的效果;

ionic2+Angular  ionScroll页面滑动监听

ionic2+Angular  ionScroll页面滑动监听

ionic2+Angular ionScroll页面滑动监听的更多相关文章

  1. 移动端H5页面惯性滑动监听

    移动端H5页面惯性滑动监听 在移动端,当你快速滑动有滚动条的页面时,当你手指离开屏幕时,滚动条并不会立即停止,而是会随着"惯性"继续滑动一段距离. 在做项目的过程中,需要监听惯性滑 ...

  2. 使用swipecard实现卡片视图左右滑动监听以及点击监听

     前言: 大家好,今天给大家介绍安卓一种特别实用有很酷炫的组件swipecard,当然这并不是安卓爸爸创造的,这是国内的一个我认为是大牛的一个人随便写着玩儿搞出来了,我看了他的代码介绍已经很清晰了,但 ...

  3. jQuery页面滚动监听事件及高级效果插件

    jQuery页面滚动监听事件及高级效果插件 1. One Page scroll (只适用于上下焦点图)http://www.thepetedesign.com/demos/onepage_scrol ...

  4. Listview的OnScrollListener的滑动监听实现分页加载

    //---------------主布局文件---------------------------- <ListView android:layout_width="fill_pare ...

  5. Android 自定义ScrollView的滑动监听事件

    项目结构: 1.LazyScrollView类(自定义ScrollView) package android.zhh.com.myapplicationscrollview; /** * Create ...

  6. Android RecyclerView滑动监听,判断是否滑动到了最后一个item

    项目中的需求,RecyclerView横向滑动列表,要有加载更多的功能,给RecyclerView设置一个滑动监听,在onScrolled方法中判断一下滑动方向,然后在onScrollStateCha ...

  7. js和jquery实现页面滚动监听

    js和jquery实现页面滚动监听 一.总结 一句话总结:onscroll方法和监听页面元素的高度都可以实现滚动监听. 1.onscroll方法实现滚动监听的核心代码是什么? <body ons ...

  8. JavaScript之屏幕上下左右滑动监听

    前言 存在这么一个需求,根据用户在屏幕不同的滑动方向(上.下.左.右),使用js脚本判断出不同的滑动行为,更新网页为不同的界面. 源码 参考了博文[1]的源码,但由于存在一些漏洞,比如:上下滑动事件监 ...

  9. Angular中使用&dollar;watch监听

    $watch简单使用 $watch是一个scope函数,用于监听模型变化,当你的模型部分发生变化时它会通知你. $watch(watchExpression, listener, objectEqua ...

随机推荐

  1. iOS 10 开发适配系列 之 权限Crash问题

    升级 iOS 10 之后目测坑还是挺多的,记录一下吧,看看到时候会不会成为一个系列. 直入正题吧 今天用一个项目小小练下手,发现调用相机,崩了.试试看调用相册,又特么崩了.然后看到控制台输出了以下信息 ...

  2. &period;NET Core配置文件加载与DI注入配置数据

    .NET Core配置文件 在以前.NET中配置文件都是以App.config / Web.config等XML格式的配置文件,而.NET Core中建议使用以JSON为格式的配置文件,因为使用起来更 ...

  3. popover带箭头弹框

    我们先来看一下效果吧: 分析:这个带箭头的弹框其实是一个控制器,通过Modal方式展现,但跟传统模态方式效果不一样,我们一眼就能看出. Xib方式实现popover: 1.segue的时候选择Pres ...

  4. 对于大量left join 的表查询,可以在关键的 连接节点字段上创建索引。

    对于大量left join 的表查询,可以在关键的 连接节点字段上创建索引. 问题: 大量的left join 怎么优化 select a.id,a.num,b.num,b.pcs,c.num, c. ...

  5. centos7 禁止防火墙

    #CentOS .0默认使用的是firewall作为防火墙,这里改为iptables防火墙. #firewall: systemctl start firewalld.service#启动firewa ...

  6. Python基础教程-第一章-变量、函数、字符串

    1.1变量 变量基本上就是代表(或者引用)某个值的名字,举例来说,如果希望用x代表3,只需要执行下面的语句即可: >>>x = 3 这样的操作称为赋值(assignment),值3赋 ...

  7. Solve error LNK2038&colon; mismatch detected for &&num;39&semi;&lowbar;ITERATOR&lowbar;DEBUG&lowbar;LEVEL&&num;39&semi;&colon; value &&num;39&semi;0&&num;39&semi; doesn&&num;39&semi;t match value &&num;39&semi;2&&num;39&semi;

    This error happens in Release mode of VS2010, solve this problem by do following: . Go to Project Pa ...

  8. Iterator和ListIterator区别

    我们在使用List,Set的时候,为了实现对其数据的遍历,我们经常使用到了Iterator(迭代器).使用迭代器,你不需要干涉其遍历的过程,只需要每次取出一个你想要的数据进行处理就可以了. 但是在使用 ...

  9. 解释型语言和编译型语言的不同以及Python如何运行

    计划写关于Python中如何实现属性管理.函数(或类方法)管理.类管理的几篇成系列的文章. 而这篇文章写在这个系列之前,希望对后面几篇文章的理解有所帮助. 老实说,我也是在网上搜索了一些资料才写的这篇 ...

  10. scrot-0&period;8

    相关库下载地址:         www.sunfreeware.com/programlistsparc10.html tar -zxvf scrot-0.8.tar.gzcd scrot-0.8. ...