Angular 4とFirebase 2を使ってReally Simple Firebaseデータベースを更新できません

Question

私が構築しているWebアプリケーションは非常に簡単で、Angular 4とfirebase2を使用しています。

私は前述の3つの特性を持つオブジェクトである曲のリストを使ってFirebase上にオブジェクト/アレイを作成しました。ユーザーが曲の中心をクリックしたときに好きな人の数が1人増えるようにしようとしていますが、試した機能のどれも動作していないようです。以下は、このaddLike関数とその結果のエラーでの私の試行であり、それは私のhtmlテンプレートとコンポーネントとデータ構造の完全なコードです。どんな助けもありがとう。ありがとうございました！ここ

addLike(index){ 
this.songs.update(index, { likes: this.songs[index] + 1 }); 

} 

//(23,1): Supplied parameters do not match any signature of call target. 

addLike(index){ 
this.songs[index].update({likes: this.songs[index] + 1 }); 
} 
//ERROR TypeError: Cannot read property 'update' of undefined 

フルコード

//COMPONENT HTML 
 
<div> TEST </div> 
 
<table class="table"> 
 
    <thead> 
 
     <tr> 
 
     <th>Title</th> 
 
     <th>Artist</th> 
 
     <th>Likes</th> 
 
     </tr> 
 
    </thead> 
 
    <tbody> 
 
    <tr *ngFor="let song of songs | async ; let i = index"> 
 
<td>{{ song.title }}</td> 
 
<td>{{ song.artist }}</td> 
 
<td>{{ song.likes }} 
 
    
 
      <i class="fa fa-heart-o" aria-hidden="true" *ngIf="song.likes < 1"></i> 
 
     <i class="fa fa-heart" aria-hidden="true" *ngIf="song.likes >= 1"></i> 
 
<i class="fa fa-plus" aria-hidden="true" (click)="addLike(i)" ></i> 
 

 
</td> 
 
    </tr> 
 
    </tbody> 
 
    </table>

//COMPONENT TS 
 

 
import { Component } from '@angular/core'; 
 
import { AngularFireDatabase, FirebaseListObservable, FirebaseObjectObservable } from 'angularfire2/database'; 
 
import { AngularFireAuthModule,AngularFireAuth} from 'angularfire2/auth'; 
 

 

 
@Component({ 
 
    selector: 'app-root', 
 
    templateUrl: './app.component.html', 
 
    styleUrls: ['./app.component.css'], 
 
}) 
 

 

 
export class AppComponent { 
 
    title = 'Oxcord'; 
 

 

 
    songs: FirebaseObjectObservable<any>; 
 
    constructor(db: AngularFireDatabase) { 
 
    this.songs = db.object('/songs'); 
 
    } 
 
    
 
    addLike(index){ 
 
this.songs[index].update({likes: this.songs[index] + 1 }); 
 

 
} 
 

 

 

 
}

{ 
 
    "songs" : [ { 
 
    "artist" : "J Cole", 
 
    "likes" : 3, 
 
    "title" : "No Role Modelz" 
 
    }, { 
 
    "artist" : "Michael Jackson", 
 
    "likes" : 8, 
 
    "title" : "Thriller" 
 
    }, { 
 
    "artist" : "Meek Mill", 
 
    "likes" : 0, 
 
    "title" : "Trash" 
 
    }, { 
 
    "artist" : "Kendrick", 
 
    "likes" : 6, 
 
    "title" : "Humble" 
 
    }, { 
 
    "artist" : "Missy", 
 
    "likes" : 4, 
 
    "title" : "Work It" 
 
    } ] 
 
}

あります

Answer 1

ローカルのsongsプロパティを更新しています。代わりに、データベースを更新する必要があります：あなたの方法では、

<i class="fa fa-plus" aria-hidden="true" (click)="addLike(song.$key, song.likes)" ></i> 

その後：

addLike(id: string, likes: number): void { 
    this.db.object(`/songs/${id}`).update({ likes: likes + 1 }); 
} 

そのように、あなたは歌keyと同類の電流量を渡して自分の曲リストにaddLikeメソッドを呼び出すことができますあなたのデータベースのその曲の場所で好きな人の数を更新することができます。

詳細については、documentationを参照してください。