Question

console.log(this.slides.length());打印Cannot read property 'length' of undefined. 在setTimeout为100时，会打印出来。

是否有任何方法可以识别子组件是否从父组件完全加载？

<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); 
    */

  }

}

Answer 1

试试这个（你不需要导入任何其他东西）：

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

尝试使用ngFor加载滑块并像魅力一样工作

Answer 2

尝试将该控制台日志放入：

ionViewDidLoad() { 

}

而不是ngAfterViewInit（）。

Answer 3

如何在孩子的onInit上举办活动并在家长中观看？ https://angular.io/guide/component-interaction#parent-listens-for-child-event

Answer 4

看起来这种情况正在发生，因为<ion-slide></ion-slide>子项未在页面挂钩上初始化。这就是为什么当你放setTimeout()时，因为在那之前它们被初始化并添加到<ion-slides>父级。挂钩后，您可以点击按钮查看length()属性。你可以找到here的作品。

Answer 5

尝试创建此方法来访问长度

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

    return 0;
}

this.slides.length（）无法读取未定义的属性“length”

5 个答案: