Deden Bangkit Deden Bangkit - 4 years ago 115
TypeScript Question

Ionic 2: join some results into one item for ion-slide

I have another similar problem with this issue, but different case. I need to display three results in ion-slide, iDangero Swipper actually will solved my problem but I belive ion-slide could do something like this also. Please check the following code;


books: Array<any>;

getBookDB(event, key) {
data => {
this.books = data = data.results;
err => {

itemTapped(event, book){
this.navCtrl.push(DetailPage, {
book: book

service provider:

apikey: string = "XXX";

getBook() {
var url = 'http://localhost:9000/findAll/BookApis/' + this.apikey;
var response = this._http.get(url).map(res => res.json());
return response;

and my ionic slide:

<ion-slide *ngFor="let book of books; let i = index" (click)="itemTapped($event, book)">
<ion-thumbnail item-left>
<img src="{{book.imgUrl}}">
<button ion-button clear item-right>View</button>

Answer Source

in this document, you could bind property slidesPerView to your slide

slidesPerView - number - Slides per view. Slides visible at the same time. Default: 1.

<ion-slides [slidesPerView]="spv">
  // slide

in .ts file

spv = 3;
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download