ionic1 下拉刷新 上拉加载 功能
html页面如下
<ion-content>
<ion-refresher pulling-text="刷新" on-refresh="search()"></ion-refresher>
<!---首页内容-->
<div>
<ul>
<li ng-repeat="position in positions">内容</li>
</ul>
</div>
<!--首页内容结束-->
<ion-infinite-scroll ng-if="searchModel.offset<=(positions.count-10)" on-infinite="loadMore()" distance="1%"></ion-infinite-scroll>
</ion-content>
js如下
angular.module('app')
.controller('IndexCtrl', function($scope, positionService) {
$scope.searchModel = {
offset: 0
}
//下拉刷新
$scope.search = function(){
$scope.searchModel.offset = 0;
positionService.getPositions($scope.searchModel)
.then(function(response){
$scope.positions = response.data;
},function(error){
})
}
//上拉加载
$scope.loadMore = function(){
$scope.searchModel.offset += 10;
positionService.getPositions($scope.searchModel)
.then(function(response){
$scope.positions = $scope.positions.concat(response.data);
},function(error){
})
}
})
具体用法参考 http://www.ionic.wang/js_doc-index-id-25.html http://www.ionic.wang/js_doc-index-id-29.html
ionic1 下拉刷新 上拉加载 功能的更多相关文章
- Android 下拉刷新上啦加载SmartRefreshLayout + RecyclerView
在弄android刷新的时候,可算是耗费了一番功夫,最后发觉有现成的控件,并且非常好用,这里记录一下. 原文是 https://blog.csdn.net/huangxin112/article/de ...
- SwipeRefreshLayout实现下拉刷新上滑加载
1. 效果图 2.RefreshLayout.java package myapplication.com.myapplication; import android.content.Context; ...
- 移动端下拉刷新上拉加载-mescroll.js插件
最近无意间看到有这么一个上拉刷新下拉加载的插件 -- mescroll.js,个人感觉挺好用的,官网地址是:http://www.mescroll.com 然后我就看了一下文档,简单的写了一个小dem ...
- 带你实现开发者头条APP(五)--RecyclerView下拉刷新上拉加载
title: 带你实现开发者头条APP(五)--RecyclerView下拉刷新上拉加载 tags: -RecyclerView,下拉刷新,上拉加载更多 grammar_cjkRuby: true - ...
- ListView实现Item上下拖动交换位置 并且实现下拉刷新 上拉加载更多
ListView实现Item上下拖动交换位置 并且实现下拉刷新 上拉加载更多 package com.example.ListViewDragItem; import android.app.Ac ...
- [ionic开源项目教程] - 第7讲 实现下拉刷新上拉加载ion-refresher和ion-infinite-scroll
第7讲 实现下拉刷新上拉加载ion-refresher和ion-infinite-scroll 1.将tab1.html的代码改为如下: <ion-content> <ion-ref ...
- JS+CSS实现的下拉刷新/上拉加载插件
闲来无事,写了一个当下比较常见的下拉刷新/上拉加载的jquery插件,代码记录在这里,有兴趣将代码写成插件与npm包可以留言. 体验地址:http://owenliang.github.io/pull ...
- 基于SwiperJs的H5/移动端下拉刷新上拉加载更多的效果
最早时,公司的H5项目中曾用过点击一个"加载更多"的DOM元素来实现分页的功能,后来又用过网上有人写的一个上拉加载更多的插件,那个插件是页面将要滚动到底部时就自动请求数据并插入到页 ...
- ListView下拉刷新上拉加载更多实现
这篇文章将带大家了解listview下拉刷新和上拉加载更多的实现过程,先看效果(注:图片中listview中的阴影可以加上属性android:fadingEdge="none"去掉 ...
- RecyclerView下拉刷新上拉加载(三)—对Adapter的封装
RecyclerView下拉刷新上拉加载(一) http://blog.csdn.net/baiyuliang2013/article/details/51506036 RecyclerView下拉刷 ...
随机推荐
- JQuery其他常用函数
isArray(obj) 检测obj否为一个数组对象 isFunction(obj) 检测obj否为一个函数 isEmptyO ...
- java中小数的处理:高精度运算用bigDecimal类,精度保留方法,即舍入方式的指定
一. 计算机的小数计算一定范围内精确,超过范围只能取近似值: 计算机存储的浮点数受存储bit位数影响,只能保证一定范围内精准,超过bit范围的只能取近似值. java中各类型的精度范围参见:http: ...
- Uva - Uva272 - TEX Quotes
TeX is a typesetting language developed by Donald Knuth. It takes source text together with a few ty ...
- SSH深度历险(四) Maven初步学习
这几天接触这个词,很多遍了,只是浅显的体会到它在GXPT中的好处,功能之强大,又通过网络查询了资料进一步的认识学习了,和大家分享. Maven是基于项目对象模型(POM),可以通过一小段描述信息来管理 ...
- 后端分布式系列:分布式存储-HDFS NameNode 设计实现解析
接前文 分布式存储-HDFS 架构解析,我们总体分析了 HDFS 架构的主要构成组件包括:NameNode.DataNode 和 Client.本文首先进一步解析 HDFS NameNode 的设计和 ...
- iOS开发中的零碎知识点笔记 韩俊强的博客
每日更新关注:http://weibo.com/hanjunqiang 新浪微博 1.关联 objc_setAssociatedObject关联是指把两个对象相互关联起来,使得其中的一个对象作为另外 ...
- SQL 2012 Always On 为 MSCRMSqlClrLogin SQL 登录名创建非对称密钥时报语法错误
根据实施手册中的下图的SQL在为MSCRMSqlClrLogin 创建非对称秘钥时报语法错误,具体的错误在就path那,调了多次还是报错,索性就把SQL拆开执行. 先执行这条 SELECT * FRO ...
- ffplay.c函数结构简单分析(画图)
最近重温了一下FFplay的源代码.FFplay是FFmpeg项目提供的播放器示例.尽管FFplay只是一个简单的播放器示例,它的源代码的量也是不少的.之前看代码,主要是集中于某一个"点&q ...
- 9.6、Libgdx之罗盘
(官网:www.libgdx.cn) 有些Android和iOS设备可能需要检测使用罗盘检测方向. 注意:罗盘当前在iOS设备中不可用,RoboVM暂不支持. 查询当前罗盘当前是否可用: boolea ...
- Android StringEntity() 和 UrlEncodedFormEntity() 的区别
今天在做安卓客户端向服务器提交数据的过程中,在组织POST数据时,用了UrlEncodedFormEntity()这个方法,但是后台报错,说是无法解析json内容. 按照本来的想法,向后台发送的是 j ...