Any one give me a infinite scroll for ionic 2 … using http.get action
Did you try just adapting the examples in the docs? Swapping out those fake async operations for http.get
should be pretty straightforward.
Finally!, i got my answer for https.get api list with infinite scroll
Here is my code,
let values = ‘BusinessUnitId=’ + this.BusinessUnitId;
this.token = sessionStorage.getItem(‘token’);
this.body = 'bearer ’ + this.token;
let headers = new Headers({ ‘Content-Type’: ‘application/json; charset=utf-8’, ‘Authorization’: this.body });
let options = new RequestOptions({ headers: headers });
this.http.get(sessionStorage.getItem(‘url’) + ‘/api/HREmployees?’ + values).map(res => res.json()).subscribe(data => {
this.loading = false;
this.employeesList = data;
this.imageList1 = data;
this.items = data;
let images = data
for (var i = 0; i < 10; i++) {
for (var j = 0; j < this.employeesList.length; j++) {
if (i === j) {
this.arr.push(this.employeesList[i]);
this.imageList = this.arr;
}
}
}
// this.initializeItems();
console.log(data);
}, (err) => {
console.log(err);
this.loading = false;
});
doInfinite(): Promise {
console.log(‘Begin async operation’);
return new Promise((resolve) => {
setTimeout(() => {
var flag = false;
if (this.count > this.imageList1.length) {
this.count = this.imageList1.length
}
for (var i = (this.imageList.length); i < this.count; i++) {
this.arr.push(this.employeesList[i]);
this.imageList = this.arr;
}
this.count += 10;
console.log('Async operation has ended');
resolve();
}, 500);
})
}
html:
<ion-item *ngFor="let employee of imageList; let index=index" (click)="itemTapped($event, employee)">
<ion-avatar item-left>
<img src="assets/user.png" />
</ion-avatar>
<div>
<h2><b>{{employee.Name}} </b></h2>
<div>
<ion-icon style="float: right" name="ios-arrow-forward"></ion-icon>
</div>
<p style="padding-top: 7px">{{employee.Designation}}</p>
</div>
<div id="wrapper" style="padding-top: 7px">
<div id="content">
<p> {{employee.NRICorFIN}}</p>
</div>
<div id="sidebar1">
<p>{{employee.DepartmentName}}</p>
</div>
<div id="cleared"></div>
</div>
