TypeError:无法读取属性' viewCtrl'在离子2中未定义

时间:2018-05-22 06:25:57

标签: angular ionic-framework ionic2

我在特定页面调用的提供程序中有一个Observable.timer。我还将一个函数传递给提供者Observable,当它完成倒计时时,它将调用位于初始页面中的函数。但是在计时器结束后我得到错误:

注意 :我在页面内部导入了View Controller但未在提供程序中导入(如果我尝试在提供程序中导入View Controller,则会出现另一个错误)

错误

  

取消订阅时发生了1次错误:↵1)TypeError:无法读取   property' viewCtrl'未定义的

  newTimer() {
    this.countDown = this.timerProvider.newTimer(this.endTimer); //pass function below
  }

  endTimer() {

    const indexModal = self.viewCtrl.index;
    // then we remove it from the navigation stack
    //this.navCtrl.remove(2);

    self.navCtrl.push(WinnersPage, {
      gameId: self.gameId
    }).then(() => {

    });

    console.log('timer ENDED');
  }

PROVIDER

  countDown: any;
  counter = 1*100;
  tick = 1000;

  constructor(public http: HttpClient) {
    //console.log('Hello TimerProvider Provider');
  }

  newTimer(endTimer) {
     return Observable.timer(0, this.tick)
      .take(this.counter).map(() => --this.counter)
      .finally(() => endTimer());
  }

1 个答案:

答案 0 :(得分:0)

您可以使用简单,

  newTimer() {
    this.countDown = this.timerProvider.newTimer(this.endTimer.bind(this)); 
  }

由于您从function呼叫another function this endTimer 的引用不可用> funciton

所以,将component this分配给global variable self并在endTimer function

中使用它

试试这个,

 let self = this;

  newTimer() {
    this.countDown = this.timerProvider.newTimer(this.endTimer); //pass function below
  }

  endTimer() {

    const indexModal = self.viewCtrl.index;
    if(self.answerModal) {
      self.answerModal.dismiss();
    }
    if(self.hintModal) {
      self.hintModal.dismiss();
    }
    self.navCtrl.push(WinnersPage, {
      gameId: self.gameId
    }).then(() => {

    });

    self.storage.set('firstAnswerCreated', '');
    self.playaudio.pause();

    console.log('timer ENDED');
  }