angularfire: FirebaseListObservable emits duplicate values for first insert

If I subscribe to an empty list, and then add a new value to that list it looks like that value is getting emitted twice. For example if I do:

let observable = this._angularFire.list('my_path', {preserveSnapshot: true});
observable.subscribe ((l) => {
  console.log('length', l.length);
});
setTimeout(() => {
  observable.add({text: 'new'});
}, 1);

If ‘my_path’ is initially empty this will output: length 1 length 2

The 2 is erroneous and contains a duplicate entry.

It doesn’t look like this problem occurs if ‘my_path’ is not initially empty.

About this issue

  • Original URL
  • State: closed
  • Created 8 years ago
  • Comments: 23 (8 by maintainers)

Most upvoted comments

Hi @davideast, I’m facing the same problem described by doovers. Here’s what I’m doing (it can easily be my fault since I’m still new to this):

test.component.ts :

import {Component} from 'angular2/core';
import {AngularFire, FirebaseListObservable} from 'angularfire2';

@Component({
    selector: 'test',
    templateUrl: 'app/test.component.html'
})

export class TestComponent{
    private _testList: FirebaseListObservable<any[]>;

    constructor(private _af: AngularFire) {
        this._testList = _af.database.list('/test');
    }

    addNew(item: any){
        this._testList.push(item);
    }

    updateMe(item: any){
        this._testList.update(item, { value: 5});
    }

    removeMe(item: any){
        this._testList.remove(item);
    }
}

test.component.html :

<ul *ngFor="#item of _testList | async">
  <li class="text">
    <p>Value: {{ item.value }}</p>
    <button type="button" (click)="updateMe(item)">Update me!</button>
    <button type="button" (click)="removeMe(item)">Remove me!</button>
  </li>
</ul>

<form #form="ngForm" (ngSubmit)="addNew(form.value)" novalidate>
  <label>Value:</label>
  <input type="text" ngControl="value" required>
  <button type="submit" [disabled]="!form.form.valid">Add</button>
</form>

If you try to update the first item of the list, it will show both the old value and the new updated value (5), and if there was only one item, every new item inserted from now on is duplicated; if you update every other item, it seems to work fine. The server always shows the correct results.