zoukankan      html  css  js  c++  java
  • 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

  • 相关阅读:
    undo表空间
    SQL*Plus快速入门
    win10用命令net启动服务没权限解决办法
    Oracle表空间管理
    Oracle数据泵(上)
    windows的bat脚本
    Servlet映射细节
    JSP技术(一)
    690. Employee Importance
    BFS和DFS详解以及java实现(转载)
  • 原文地址:https://www.cnblogs.com/luffyc/p/7218016.html
Copyright © 2011-2022 走看看