等待代码完成Ionic生命周期

时间:2018-10-29 13:18:36

标签: javascript ionic-framework

我的ionViewWillLoad()函数中有代码:

ionViewWillLoad() {
  if (this.city) {
    this.apiService.getProductsByCategory(this.city.CategoryID)
      .subscribe((data: Product[]) => {
          this.extractActivities(data) 
        }, 
        (err) => console.log(err),
      );
    }
  }
}

并在ionViewDidEnter()函数中进行编码:

ionViewDidEnter() {
  for (let i = 0; i < this.activities.length; i++) {
    $('.' + this.activities[i].name.replace(/\s/g, '')).slick({
      speed: 300,
      slidesToShow: 2,
      slidesToScroll: 1,
      prevArrow: $('.r-arrow' + i),
      nextArrow: $('.l-arrow' + i),
    })
  }
}

ionViewDidEnter代码取决于ionViewWillLoad代码。仅在“ WillLoad”完成后如何运行“ DidEnter”?

1 个答案:

答案 0 :(得分:1)

如果不需要每次输入页面都运行代码,则可以直接在

之后运行didEnter方法的代码。
this.extractActivities(data)
// perform action here

否则,您可以使用离子生命周期挂钩ionViewDidLoad或角度生命周期挂钩ngAfterViewInit。如果您需要在ionViewDidEnter内部执行此操作,只需在页面中添加一个布尔实例变量即可表明ionViewWillLoad方法是否已完成。加载完成后将其设置为true。

this.extractActivities(data)
// perform action here
this.loadComplete = true;

和您的

ionViewDidEnter() {
  if(!this.loadComplete){
    return;
  }
  for (let i = 0; i < this.activities.length; i++) {
    $('.' + this.activities[i].name.replace(/\s/g, '')).slick({
      speed: 300,
      slidesToShow: 2,
      slidesToScroll: 1,
      prevArrow: $('.r-arrow' + i),
      nextArrow: $('.l-arrow' + i),
    })
  }
}