离子 3 “类型错误:这是空的”

Question

当我从Firebase获取数据时，我正在尝试重定向。如果它为 null 或空，则无需重定向。

我正在尝试使用this.navCtrl.push(ProspectPage);但不知道为什么它不起作用它返回一个错误

TypeError: this is null

这是我的代码，请检查一下，让我知道我在这里做错了什么。

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { ProspectPage } from '../prospect/prospect';
import * as firebase from 'firebase';
@Component({
  selector: 'page-credentials',
  templateUrl: 'credentials.html'
})
export class CredentialsPage {
  constructor(public navCtrl: NavController) {
}
register(params){
// this.navCtrl.push(ProspectPage); // if i wrote here then it works
  ref.orderByChild("ssn").equalTo(1234).on("value", function(snapshot) {
    if(snapshot.val())
    {
      this.navCtrl.push(ProspectPage);
    }
   });
  }
 }

请参阅注册((有一个注释。如果我在函数开头添加this.navCtrl.push(ProspectPage);然后它起作用了。但是当我从 Firbase 获取数据时，它应该可以工作。

这是我的 html 代码。

<button id="credentials-button1" ion-button color="stable" block on-click="register()"> Lets go! </button>

Answer 1

您的问题的答案是箭头函数：

箭头函数表达式的语法比函数短 表达式并且不绑定自己的 this、参数、super，或 新目标。

  register(params) {
    ref.orderByChild("ssn").equalTo(1234).on("value", (snapshot) => {
        if(snapshot.val()) {
            this.navCtrl.push(ProspectPage);
        }
    });
  }

请注意(snapshot) => {...}而不是function(snapshot) {...}

Answer 2

示例：

this.a = 100;
let arrowFunc = () => {this.a = 150};
function regularFunc() {
this.a = 200;
}
console.log(this.a)
arrowFunc()
console.log(this.a);
regularFunc()
console.log(this.a);
/*
Output
100
150
150
*/

更正后的代码是：

register(params){
// this.navCtrl.push(ProspectPage); // if i wrote here then it works
//convert to arrow function
 ref.orderByChild("ssn").equalTo(1234).on("value", (snapshot)=> {   
 if(snapshot.val())
    {
    this.navCtrl.push(ProspectPage);
 }
 });
 }