ERROR TypeError:无法设置属性' product'为null

时间:2018-06-08 22:26:56

标签: javascript angular firebase ionic3

我试图打印我在前端发送的信息,但是我得到了这个错误,我不知道发生了什么,我的查询很好,因为当我在控制台中打印时工作正常

错误: https://snag.gy/dAFq4k.jpg

HOME.TS

export class HomePage {
  options:BarcodeScannerOptions;
  encodText:string='';
  resul:string;
  encodedData:any={};
  scannedData:any={};
  public resultado: string;

  public product= [];
  // public product= {};


public resultadoref: firebase.database.Reference = firebase.database().ref('/productos');

  constructor(public fdb: AngularFireDatabase,public navCtrl: NavController,
  public scanner:BarcodeScanner,private alertCtrl: AlertController) {

  }

  public cargarvalor(){
    var referenceresultado= this.resultadoref.orderByChild('Producto').equalTo(this.resultado);
    referenceresultado.on('value', function(snapshot){
    var data = snapshot.val();
    console.log(data);
    // this.product=snapshot.val();
    this.product= snapshot.val();
    });
  }
}

home.html的

<div>

        <ion-input type="text" [(ngModel)]="resultado"></ion-input>
        <button ion-button (click)="cargarvalor()">Buscar</button>


    </div>

        <div class="row header">
          <div class="col">Producto</div>
          <div class="col">Descripcion</div>
          <div class="col">Precio</div>
        </div>

       <div class="row">

        {{ product.Producto }}
        {{ product.Valor }}
        {{ product.Descripcion }}


       </div>

1 个答案:

答案 0 :(得分:1)

this更改回调中的引用。因此this.product不会引用您的数组。由于回调的调用方式,this实际上是空的。

请尝试此修改:

public cargarvalor(){
   var self = this;
   var referenceresultado = this.resultadoref.orderByChild('Producto').equalTo(this.resultado);
   referenceresultado.on('value', function(snapshot) {
      self.product= snapshot.val();
   });
}