Question

我正在使用AngularFire2 2.0.0-beta.7和Angular 2.3.1。我很擅长使用Angular和Firebase，所以我不确定这是不是我这样做的问题还是一个bug？

在实时数据库中，我有events和attendees。您可以参加/无人参加活动。非常简单的东西。

如果您还没有参加活动，您可以随意参加/无人参与，并且按预期工作，数据库和与会者名单都会更新。

我遇到的问题是，如果您已经参加，则可以无人值守，但是，如果您再次尝试再次参加，则会更新数据库，但不会更新与会者列表。如果我刷新页面或导航并再次返回，则列表会按预期更新。

以下是该组件的代码。您还可以看到video showing the issue here。

import { Component, OnInit } from '@angular/core';

import { AngularFire, FirebaseListObservable, FirebaseObjectObservable } from 'angularfire2';

@Component({
  selector: 'app-root',
  template: `
    <h1>
      {{(event | async)?.name}}
    </h1>

    <button (click)="attend()">Attend</button> <button (click)="unattend()">unattend</button>

    <ul>
      <li *ngFor="let attendee of attendees | async">
        {{attendee.$key}}
      </li>
    </ul>
  `,
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
  title = 'Event';
  eventId: string;
  userId: string;
  event: FirebaseObjectObservable<any>;
  attendees: FirebaseListObservable<any>;

  constructor(private af: AngularFire) {}

  ngOnInit() {
    this.eventId = '-KcDcCSkb_0zqd-TX6RG';
    this.userId = 'LupQbOKjmrSTKgri1eUr7WckJL13';

    this.event = this.af.database.object(`events/${this.eventId}`);
    this.attendees = this.af.database.list(`attendees/${this.eventId}`);
  }

  attend() {
    this.af.database.object(`attendees/${this.eventId}/${this.userId}`).set(true);
  }

  unattend() {
    this.attendees.remove(`${this.userId}`)
  }
}

非常感谢任何帮助！

更新

好的，这是AngularFire2库中的一个错误，并已修复此pull request

AngularFire2 FirebaseListObservable并不总是更新

0 个答案: