|
Сообщение от djan
|
|
Задача состоит в том выводить элементы как в примере
|
Как вариант...
<html ng-app="ionicInfiniteScrollApp">
<head lang="en">
<meta charset="UTF-8">
<link href="http://code.ionicframework.com/nightly/css/ionic.min.css" rel="stylesheet">
<script src="http://code.ionicframework.com/nightly/js/ionic.bundle.min.js"></script>
<title>Infinite App Example </title>
<script type='text/javascript'>
/**
* Created by singhdi on 2014-07-26.
*/
var app = angular.module("ionicInfiniteScrollApp",['ionic']);
app.controller("InfiniteAppCntrl",['$scope', '$http', '$timeout',function($scope, $http, $timeout){
$scope.moredata = false;
debugger;
$scope.loadMoreData=function(data){
$http.get('http://vse-sto.com.ua/api/v1/cities/')
.success(function(data){
$scope.cities = data;
var key=$timeout(function(){
var i=$scope.items.length;
$scope.items.push({name: data[i].name});
$scope.$broadcast('scroll.infiniteScrollComplete');
if (++i>data.length){
$scope.moredata=true;
$timeout.cancel(key);
};
},100);
})
};
$scope.items=[];
}]);
</script>
</head>
<body ng-controller="InfiniteAppCntrl">
<ion-content>
<ion-header-bar >{{items.length}} items</ion-header-bar>
</ion-content>
<ion-content class="has-header">
<ion-list>
<ion-item ng-repeat="item in items" item="item" href="#{{item}}">
{{$index}} {{item.name}}
</ion-item>
<ion-infinite-scroll distance="2"
on-infinite="loadMoreData()"
ng-if="!moredata"
></ion-infinite-scroll>
</ion-list>
</ion-content>
</body>
</html>