【问题标题】:AngularFire5 — Reference.update failed: First argument contains a function in propertyAngularFire5 — Reference.update 失败:第一个参数在属性中包含一个函数
【发布时间】:2017-12-05 09:24:55
【问题描述】:

我正在尝试将更改保存到我的 Firebase 数据库中的现有节点,但我在此处收到此错误:

Reference.update 失败:第一个参数包含属性“matatu-list.-L-RMcqjnladFM5-V80b.payload.node_.children_.comparator_”中的函数,内容 = function NAME_COMPARATOR(left, right) { 返回 util_1.nameCompare(left, right); }

我想根据其各自的键(从另一个页面通过navParams 传递)来编辑一个项目。

这是我用来构建数据库的接口:

interface.ts

export interface Matatu {
    $key?: string;
    matNumberPlate: string;
    matSacco: string;
    matDriver: string;
    matAccessCode: string;
    matStatus: string;
    matTracker: string;
    matLocation: string;

    //Optionals
    payload?:any;
    key?:any;

}

用于更新记录的.ts.html 代码:

.ts

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { AngularFireObject, AngularFireDatabase } from 'angularfire2/database';
import { Matatu } from '../../models/matatu/matatu.interface';
import { Subscription } from 'rxjs/Subscription';


@IonicPage()
@Component({
  selector: 'page-edit-ma3',
  templateUrl: 'edit-ma3.html',
})
export class EditMa3Page {

  matatuRef$: AngularFireObject<Matatu>;
  matatuAsync$: any;
  matatu = {} as Matatu;
  sub: Subscription;

  constructor(public navCtrl: NavController, public navParams: NavParams, private database: AngularFireDatabase) {

    const matKey = this.navParams.get('matKey');
    this.matatuRef$ = this.database.object(`matatu-list/${matKey}`);
    this.matatuAsync$ = this.matatuRef$.snapshotChanges();
    //console.log(matKey);

    this.sub = this.matatuAsync$.subscribe(
      matatu => this.matatu = matatu
    )
  }

  editMatatu(matatu : Matatu){
    this.matatuRef$.update(matatu);

    this.navCtrl.pop();
  }

  ionViewWillLeave(){
    this.sub.unsubscribe();
  }

}

.html

<ion-content>
  <ion-list>
    <ion-list-header>
      Matatu Details 
    </ion-list-header>

    <ion-item>
        <ion-label>Sacco</ion-label>
        <ion-input type="text" [(ngModel)]="matatu.matSacco"></ion-input>
    </ion-item>

    <ion-item>
        <ion-label>Driver</ion-label>
        <ion-input type="text" [(ngModel)]="matatu.matDriver"></ion-input>
    </ion-item>

    <ion-item>
          <ion-label> Access Code</ion-label>
          <ion-input type="password" [(ngModel)]="matatu.matAccessCode"></ion-input>
    </ion-item>

  </ion-list>
  <ion-list radio-group [(ngModel)]="matatu.matTracker">
    <ion-list-header>
      Preferred Tracking 
    </ion-list-header>

    <ion-item>
        <ion-label>GPS</ion-label>
        <ion-radio checked="true" value="GPS"></ion-radio>
    </ion-item>

    <ion-item>
        <ion-label>Driver's Location</ion-label>
        <ion-radio value="Driver's Location"></ion-radio>
    </ion-item>
  </ion-list>

  <div padding>
    <button ion-button block (click)="editMatatu(matatu)">Save Changes</button>
  </div>
</ion-content>

我该如何解决这个问题?如果有人向我指出我哪里出错了,我将不胜感激,还有什么其他方法可以完成这项工作(即使是肮脏的!)。

【问题讨论】:

    标签: firebase firebase-realtime-database ionic3 angularfire5


    【解决方案1】:

    您可以在占位符变量中传递密钥,也可以像这样连接它:

    this.matatuRef$ = this.database.object(`matatu-list/`+ matKey);
    

    请记住,这不是一个好方法,但可以解决问题。

    当您尝试推送包含函数或数据类型而不是数据值的数据时,Firebase 会触发此错误。

    根据您的界面以及您从模板传递的值,您的
    更新方法应该是这样的:

    editMatatu(matatu : Matatu){
    
        this.matatuRef$.update({
          matDriver: this.matatu.matDriver,
          matAccessCode: this.matatu.matAccessCode,
          matSacco: this.matatu.matSacco
        });
    
    
      }
    

    【讨论】:

    • 问题又出现了。
    • 我已经修改了答案。
    猜你喜欢
    • 2021-03-03
    • 1970-01-01
    • 2018-08-18
    • 2021-02-12
    • 2018-02-22
    • 2015-01-31
    • 2016-04-14
    • 2018-08-08
    • 2018-03-01
    相关资源
    最近更新 更多