2017-12-05 4 views
1

に機能が含まれて私は私のFirebase DB内の既存のノードへの変更を保存しようとしているが、私はここに、このエラーを取得しています:AngularFire5 - Reference.updateに失敗しました:最初の引数はプロパティ

リファレンス.update failed:最初の引数には、コンテンツ 'matatu-list.-L-RMcqjnladFM5-V80b.payload.node_.children_.comparator_'の中に関数= NAME_COMPARATOR(左、右)の関数が含まれています。{ return util_1.nameCompare右); }

私は(navParamsを介して、他のページから渡された)そのそれぞれのキーに基づか項目を編集したいです。ここで

は、私はDBを構築するためのインタフェースである:

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> 

は、どのように私はこれを整流については行くのですか?私が間違っていた箇所がわたしに指摘されていれば、それを感謝することができます。

答えて

1

あなたは、変数プレースホルダに鍵を渡すこともできますし、ちょうどそうのようにそれを連結することができます:

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

これは良い方法ではないですが、それはトリックを行うだろう心に留めておくようにしてください。

ファンクションを含むデータまたはデータ値ではなくデータ型をプッシュしようとすると、このエラーが発生します。

あなた
更新方法は、このようにする必要があり、あなたのインターフェイスに基づか、および値は、あなたがテンプレートから渡している:

editMatatu(matatu : Matatu){ 

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


    } 
+0

問題が再び再発しました。 – kenyami

+0

私は私の答えを改訂しました。 – mondieki

関連する問題