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 下拉刷新 上拉加载 功能的更多相关文章

  1. Android 下拉刷新上啦加载SmartRefreshLayout + RecyclerView

    在弄android刷新的时候,可算是耗费了一番功夫,最后发觉有现成的控件,并且非常好用,这里记录一下. 原文是 https://blog.csdn.net/huangxin112/article/de ...

  2. SwipeRefreshLayout实现下拉刷新上滑加载

    1. 效果图 2.RefreshLayout.java package myapplication.com.myapplication; import android.content.Context; ...

  3. 移动端下拉刷新上拉加载-mescroll.js插件

    最近无意间看到有这么一个上拉刷新下拉加载的插件 -- mescroll.js,个人感觉挺好用的,官网地址是:http://www.mescroll.com 然后我就看了一下文档,简单的写了一个小dem ...

  4. 带你实现开发者头条APP(五)--RecyclerView下拉刷新上拉加载

    title: 带你实现开发者头条APP(五)--RecyclerView下拉刷新上拉加载 tags: -RecyclerView,下拉刷新,上拉加载更多 grammar_cjkRuby: true - ...

  5. ListView实现Item上下拖动交换位置 并且实现下拉刷新 上拉加载更多

    ListView实现Item上下拖动交换位置  并且实现下拉刷新  上拉加载更多 package com.example.ListViewDragItem; import android.app.Ac ...

  6. [ionic开源项目教程] - 第7讲 实现下拉刷新上拉加载ion-refresher和ion-infinite-scroll

    第7讲 实现下拉刷新上拉加载ion-refresher和ion-infinite-scroll 1.将tab1.html的代码改为如下: <ion-content> <ion-ref ...

  7. JS+CSS实现的下拉刷新/上拉加载插件

    闲来无事,写了一个当下比较常见的下拉刷新/上拉加载的jquery插件,代码记录在这里,有兴趣将代码写成插件与npm包可以留言. 体验地址:http://owenliang.github.io/pull ...

  8. 基于SwiperJs的H5/移动端下拉刷新上拉加载更多的效果

    最早时,公司的H5项目中曾用过点击一个"加载更多"的DOM元素来实现分页的功能,后来又用过网上有人写的一个上拉加载更多的插件,那个插件是页面将要滚动到底部时就自动请求数据并插入到页 ...

  9. ListView下拉刷新上拉加载更多实现

    这篇文章将带大家了解listview下拉刷新和上拉加载更多的实现过程,先看效果(注:图片中listview中的阴影可以加上属性android:fadingEdge="none"去掉 ...

  10. RecyclerView下拉刷新上拉加载(三)—对Adapter的封装

    RecyclerView下拉刷新上拉加载(一) http://blog.csdn.net/baiyuliang2013/article/details/51506036 RecyclerView下拉刷 ...

随机推荐

  1. JVM的GC(概念与深入)

    深入浅出了解什么是GC: http://my.oschina.net/xianggao/blog/86985 GC策略详解: http://blog.csdn.net/winniepu/article ...

  2. Android数据库Sqlite-android学习之旅(九)

    简介 sqilte是一个轻量级的数据库,满足数据库的基本操作,由于移动端的内存有限,所以sqilte刚好能满足移动端开发的基本要求. 废话不多说,上代码 1.首先介绍一下,sqlite的管理类SQLi ...

  3. App引导界面,可以这么玩

    什么是ViewPager,刚一听到这个词,我们可能感觉很奇怪,但是我相信我们大部分人都曾见到过这些界面的.其实它就是我们在安装好一个app之后第一次使用时的那些引导界面的效果.这就是通过ViewPag ...

  4. java实现:将一个数逆序输出

    前面我们用C语言实现过这个程序,其实java也一样的,很多步骤跟C差不多,但是有些接口和特性可能不同: import java.util.Scanner;//要使用scanner这个类,就需要导入一个 ...

  5. Chipmunk僵尸物理对象的出现和解决(一)

    最近在写的BrickHit游戏App中出现了一个比较头疼的问题. 该问题很难用常规手段调试,因为其发生看起来貌似是随机的. 我想在这里将这个问题的现象和解决过程详细的记录下来,一来避免其他童鞋走弯路, ...

  6. ZooKeeper实现分布式锁

    使用场景          一般的锁是指单进程多线程的锁,在多线程并发编程中,用于线程之间的数据同步,保证共享资源的访问.而分布式锁,指的是在分布式环境下,保证跨进程.跨主机.跨网络的共享资源,实现互 ...

  7. 开源数字媒体资产管理系统:Razuna

    Razuna以一个使用Java语言编写的开源的数字媒体资产管理(Digital Asset Management)系统.功能很强大,可以用于管理各种格式的数字媒体资源. Razuna在本机的安装配置还 ...

  8. [面试算法题]比较二叉树异同-leetcode学习之旅(5)

    问题描述 Given two binary trees, write a function to check if they are equal or not. Two binary trees ar ...

  9. 算法面试题-leetcode学习之旅(二)

    题目: Given a non-negative integer num, repeatedly add all its digits until the result has only one di ...

  10. 用javah 导出类的头文件, 常见的错误及正确的使用方法

    ******************************************************************************** 用javah 导出类的头文件, 常见的 ...