为什么angularfire（afAuth.user | async）用户不同于afAuth.user.subscribe

Question

我很好奇为什么对象不同。我有一个简单的Angular组件，如下所示：

user.component.html

  <pre *ngIf="(afAuth.user | async) as user"> {{ user | json }}</pre>

我曾经用过，所以我可以查看用户的属性。

user.component.ts

constructor(private afAuth: AngularFireAuth) {

  this.afAuth.user.subscribe(val => {
  console.log('user change', val);
  this.updateUserData(val);
});

}

但是，订阅中返回的'val'对象与视图中显示的对象不同。为什么视图中显示的对象与我手动订阅时返回的对象不同？

我的理解是异步管道只是为您订阅。我想念什么？

我问是因为我想访问user.lastLoginAt和user.createdAt属性并将它们存储在firestore中。

在视图截图中：

console.log（val）控制台屏幕截图：

Answer 1

如果您在模板中使用async，则模板中也不应包含.subscribe。我怀疑模板变量是此方法的返回this.updateUserData(val);

您需要使用tap中的RxJS运算符来做可能有副作用的任何事情。

this.afAuth.user
  .pipe(
    tap((val) => {
      // any code in here will not change the `val`
      this.updateUserData(val);
    })
  )
  .subscribe(val => {
    console.log('user change', val);
  });