2

我对 Angular 很陌生..

我的网络应用程序中有一个 AuthService，它通过 Angularfire2（firebase）对用户进行身份验证，并将电子邮件和一个标志（指示用户是否填写了配置文件数据表单）插入到 firebase 数据库中。

我的路由守卫检查用户是否经过身份验证以及用户是否填写了配置文件数据表单，如果没有，我将重定向到配置文件数据表单。如果用户已经填写了表格，我会直接进入希望页面。

我通过UserData 服务获取用户是否填写了基本数据表：

  constructor(private afd: AngularFireDatabase, private authService: AuthService) {

  }

  isProfileComplete (): Observable<any> {
    return this.afd.list(`/users/${this.authService.uid}`)
            .snapshotChanges()

  }

然后在authGuard我做逻辑来指导用户：

 constructor(private authService: AuthService,
              private router: Router,
              private usrData: UserDataService) {}

  canActivate( route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {

    if (this.authService.isAuthenticated())  {
      console.log(this.usrData.isProfileComplete())
      this.usrData.isProfileComplete()
      .map(userInfos => {
        console.log(userInfos)
           userInfos.forEach(item => {
            console.log(userInfos)
            if ((item.payload.key === 'profileComplete') && (item.payload.val() === true)) {
              console.log('user is logged in & data form completed')
              return true;
            } else if ((item.payload.key === 'profileComplete') && (item.payload.val() !== true)) {
              this.router.navigate(['data_form']);
              console.log('user logged in not completed the form')
              return false;
            }
      })

      })

    }  else {
        this.router.navigate(['login']);
        console.log('user is not logged in ')
        return false;
    }
}

我认为代码没有到达observable的map部分来读取 key profileComplete的值

有人可以请我指出正确的方向吗？

谢谢

4

2 回答 2

0

您应该Observable<boolean> | Promise<boolean>从CanActivate. 因为 JavaScript 不等待回调。例子：

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {

if (this.authService.isAuthenticated()) {
  console.log(this.usrData.isProfileComplete())
  return this.usrData.isProfileComplete()
    .map(userInfos => {
      console.log(userInfos)
      userInfos.forEach(item => {
        console.log(userInfos)
        if ((item.payload.key === 'profileComplete') && (item.payload.val() === true)) {
          console.log('user is logged in & data form completed')
          return of(true);
        } else if ((item.payload.key === 'profileComplete') && (item.payload.val() !== true)) {
          this.router.navigate(['data_form']);
          console.log('user logged in not completed the form')
          return of(false);
        }
      })

    })

} else {
  this.router.navigate(['login']);
  console.log('user is not logged in ')
  return of(false);
}

}

于 2018-05-11T04:43:35.550 回答
0

以下是否返回 Observable？

this.usrData.isProfileComplete()

无论如何，您从 forEach 循环的上下文中返回 true / false，这意味着外部 map 方法没有返回任何内容。

您可能要考虑使用 afind而不是 forEach，然后您可以返回是否find找到任何东西的结果：

return !!userInfos.find(item => (item.payload.key === 'profileComplete') 
                                && (item.payload.val() === true));

显然，这不能处理您想要返回表单的重定向情况，但应该为您指明正确的方向

于 2018-05-11T05:22:30.397 回答