Javascript 在Angular应用程序中，在何处放置FirebaseAuth.onAuthStateChanged调用？

在Angular app中添加调用以初始化全局侦听器的合适位置是什么

代码如下：

export class AuthService {
  constructor(
    private store: Store<fromAuth.State>,
    private afAuth: AngularFireAuth
  ) {
    this.afAuth.auth.onAuthStateChanged(payload => {
      if (payload) {
        const user: UserBeta = {
          uid: payload.uid,
          displayName: payload.displayName,
          email: payload.email,
          emailVerified: payload.emailVerified
        };

        this.store.dispatch(AuthActions.authenticated({ user }));
      } else {
        this.store.dispatch(AuthActions.notAuthenticated());
      }
    });
  }

正如您所看到的，我已经将它添加到AuthService的构造函数中，但它似乎不适合我

我还关心的是以下代码有两个依赖项：Ngrx和AngularFireAuth

在这种情况下，移动到FirebaseModule的某个位置，即firebase.module.ts是否正确？如果是，调用将是什么样子？

您可以从以下文档将其添加到ngOnInit中：

一种回调方法，在默认更改检测器第一次检查指令的数据绑定属性之后，在检查任何视图或内容子项之前，立即调用该方法。当指令被实例化时，它只被调用一次

查看此处了解更多信息：

---

谢谢大家的回复

我最终决定在AuthService中引入一个新的initialize方法，并在AppComponent的ngOnInit方法中调用它

auth.service.ts：

---

更新：在我的项目中，我使用ngrx进行状态管理。由于AngularFireAuth还管理用户信息，我在多个位置管理同一状态时遇到了困难，这增加了复杂性，因此最终的解决方案变得相当复杂。最后，我决定停止使用onAuthStateChanged侦听器，并开始在本地持久化ngrx状态。

我一直在努力解决这个问题。我最后在组件中等待，在那里我需要检查一个用户，以确保我得到用户的结果。根据我的经验，构造函数可能很棘手。我只是在服务中创建了一个普通的方法，并在必要的组件中订阅它。要在全球范围内拥有一些东西真的很难。是的，似乎AppComponent的ngOnInit应该是这样

@Injectable({ providedIn: 'root' })
export class AuthService {
  constructor(
    private http: HttpClient,
    private store: Store<fromAuth.State>,
    private afAuth: AngularFireAuth
  ) { }

  initialize() {
    this.afAuth.auth.onAuthStateChanged(payload => {
      if (payload) {
        const user: UserBeta = {
          uid: payload.uid,
          displayName: payload.displayName,
          email: payload.email,
          emailVerified: payload.emailVerified
        };

        this.store.dispatch(AuthActions.authenticated({ user }));
      } else {
        this.store.dispatch(AuthActions.notAuthenticated());
      }
    });
  }
}

export class AppComponent implements OnInit {
  constructor(private authService: AuthService) { }

  ngOnInit(): void {
    this.authService.initialize();
  }
}