(补充)ionic js 指令布局的小技巧

来源:互联网 发布:韩佳人长相分析知乎 编辑:程序博客网 时间:2024/05/15 11:03

<body ng-controller="firstCtrl"><ion-header-bar class="bar-positive"><h1 class="title">ion-infinite-scroll</h1></ion-header-bar><ion-content><ion-infinite-scroll   on-infinite="load_more();" icon="ion-load-a" distance="1%" immediate-check="true"><!-- 当immediate-check=“false” 的时候 内容区只加载默认数据 $scope.items = ['1111','22222']; 只有在刷新的时候回加载load_more()函数--><!--当immediate-check=true 的时候 ,内容区如果数据不够的话,会一直调用load_more()函数,一直铺满这个内容区  --></ion-infinite-scroll>        <ul class="list">            <li class="item"  ng-repeat="item in items">{{item}}</li>        </ul></ion-content></body></html><script>angular.module("myApp",["ionic"]).controller("firstCtrl",function($scope,$timeout){$scope.items = ['1111','22222'];var base = 0;$scope.load_more = function(){$timeout(function(){for(var i=0;i<3;i++,base++)$scope.items.push(["item ",base].join(""));$scope.$broadcast("scroll.infiniteScrollComplete");},500);};});</script>

<span style="font-family: Arial, Helvetica, sans-serif;"><script></span>
angular.module("myApp",["ionic"]).controller("firstCtrl",function($scope,$timeout,$ionicScrollDelegate){        $scope.goTop = function(){            $ionicScrollDelegate.scrollTop(true);             a = $ionicScrollDelegate.getScrollPosition();        };        $scope.goButtom = function(){                 a = $ionicScrollDelegate.getScrollPosition();                $scope.scrollTo(10,a.top)            console.log(a);        }    //控制置顶的效果            var base = 0;$scope.items = [];$scope.load_more = function(){$timeout(function(){for(var i=0;i<3;i++,base++)$scope.items.push(["item", base].join(""));$scope.$broadcast("scroll.infiniteScrollComplete")},500)}})</script>


0 0