Question

从firebase列表中可视化转换对象的正确方法是什么？

以下代码有一些副作用，并在我的模板中创建重复的结果。第一次正确加载但第二次访问页面后，显示重复的结果。

loadAccountUsers() {
        return this.af.database.list(`accounts/${this.authService.accountUID}/accountUsers`)
            .flatMap(list => list)
            .map((data: any) => {
                let role: string = (data.accountLevel === 10 ? 'Administrator' : 'User');
                return {
                    firstName: data.firstName,
                    lastName: data.lastName,
                    emailAddress: data.emailAddress,
                    role: role
                };
            })
            .scan((arr, val) => arr.concat([val]), [])
    }

当我不改变物体时，一切都很好

   loadAccountUsers() {
      return this.af.database.list(`accounts/${this.authService.accountUID}/accountUsers`)
}

Answer 1

flatMap将列表中的每个元素发送到可观察流中。当数据库发生更改并发出另一个列表时，也会发出其元素。但是，scan操作是将发出的元素组合成一个数组 - 因此是重复的。

您可以使用RxJS map运算符和Array.prototype.map方法来解决问题：

loadAccountUsers() {
    return this.af.database.list(`accounts/${this.authService.accountUID}/accountUsers`)
        .map((list) => list.map((data) => {
            let role: string = (data.accountLevel === 10 ? 'Administrator' : 'User');
            return {
                firstName: data.firstName,
                lastName: data.lastName,
                emailAddress: data.emailAddress,
                role: role
            };
        }));
}

从Firebase列表转换对象的正确方法？

1 个答案: