davideast
commented
7 years ago @Anystrous
Update: I see the problem. The docs need this fix:
import { Component } from '@angular/core';
import { AngularFireDatabase, AngularFireList } from 'angularfire2/database';
import { Observable } from 'rxjs/Observable';
@Component({
selector: 'app-root',
template: `
<ul>
<li *ngFor="let item of items | async">
<input type="text" #updatetext [value]="item.text" />
<button (click)="updateItem(item.$key, updatetext.value)">Update</button>
<button (click)="deleteItem(item.$key)">Delete</button>
</li>
</ul>
<input type="text" #newitem />
<button (click)="addItem(newitem.value)">Add</button>
<button (click)="deleteEverything()">Delete All</button>
`,
})
export class AppComponent {
itemsRef: AngularFireList<any>;
items: Observable<any[]>;
constructor(db: AngularFireDatabase) {
this.itemsRef = db.list('messages');
this.items = this.itemsRef.valueChanges();
}
addItem(newName: string) {
this.itemsRef.push({ text: newName });
}
updateItem(key: string, newText: string) {
this.itemsRef.update(key, { text: newText });
}
deleteItem(key: string) {
this.itemsRef.remove(key);
}
deleteEverything() {
this.itemsRef.remove();
}
}
We had breaking changes in version 5.0. There is a migration guide and if you want you can continue to use the old database API with angularfire2/database-deprecated.
The main difference in this sample is that FirebaseListObservable no longer exists and we switched to a Service Based API in AngularFireList<T>. This allows you to do data operations like push(), andset(). It also allows you to create different types of observable streams. You can get similar results with the old API in .valueChanges() and do tons of other great things with .snapshotChanges(), .stateChanges(), and .auditTrail().
I highly recommend using this API. Check out the documentation. File an issue if you find anything confusing. We're here to help :)
Anystrous
gerhardcit
Anthony2539
ayoubboumzebra
andy-parinas
abhinpai
Heenash04
horlah
ericmulcahy
ix-xerri
markterrill
Bruswei
just67
Since the update the documentation examples are completely broken.
For example: This list example wont compile
I get the error saying Property 'push' , 'update', 'remove' does not exist on type Observable<any[]>.
Yes I did update to version 5 using @next.
Previous examples were working great with version 4.
The dependencies are also incorrect in the Object example.
Please correct me if I am wrong.