this.slides.length() Cannot read property 'length' of undefined

Viewed 3442

console.log(this.slides.length()); prints Cannot read property 'length' of undefined. On setTimeout of 100, this prints.

Is there any method to identify a child component is fully loaded from the parent component?

<ion-content padding class="ttct-app-content">
    <ion-slides>
      <ion-slide>
        <h1>Slide 1</h1>
      </ion-slide>
      <ion-slide>
        <h1>Slide 2</h1>
      </ion-slide>
      <ion-slide>
        <h1>Slide 3</h1>
      </ion-slide>
    </ion-slides>
</ion-content>
import { Component, ViewChild } from '@angular/core';
import { NavController, Slides } from 'ionic-angular';

@Component({
  selector: 'page-compose',
  templateUrl: 'compose.html',
})
export class Compose {
  @ViewChild(Slides) slides: Slides;

  constructor(public navCtrl: NavController) {
  }

  ngAfterViewInit(){
    console.log(this.slides.length()); //Cannot read property 'length' of undefined
    //works
    /*
    setTimeout(()=>{    
      console.log(this.slides.length());
    },100); 
    */

  }

}
5 Answers

Try this (you don't need to import anything else):

ionViewDidEnter() {
    console.log(this.slides.length());
}

Tried also with a slider loaded using a ngFor and worked like a charm

Try to create this method to access to lenght

 get slides_length() {
    if (this.slides && this.slides._slides) {
        return this.slides._slides.length;
    }

    return 0;
}
Related