如何从Angular中RXJS的可观察函数处理返回值

Question

我在 Angular 中有一个登录视图。我做了：

1. 一个 UserService 来获取用户数据。

2. 一个 AuthService 用于检查有效用户。

因此，从登录视图中，我将用户名传递给 AuthService，它与 UserService 联系以获取数据并操作数据并返回 boolean 值，无论用户是有效与否。

登录视图代码如下：

身份验证服务：

this.authenticationService.checkValidLogin(userName,password);

身份验证服务：

checkValidLogin(username: string, password: string) {
    this.userService.getUserByEmail(username).snapshotChanges().pipe(map(data => data.map(c => ({ key: c.payload.doc.id, ...c.payload.doc.data() })))).subscribe(res => {
        if (res[0].password === password) {
            return true;
        } else {
            return false;
        }
    });
}

我已经返回 true 或 false 但不会返回到方法..!!

我想从订阅中返回 true 或 false 值，或者我在这里缺少什么？

Answer 1

由于代码是异步的，所以你需要返回Observable并订阅它来检查它的有效性。

checkValidLogin(username: string, password: string): Observable<boolean> {
    return this.userService.getUserByEmail(username).snapshotChanges().pipe(map(data => data.map(c => ({ key: c.payload.doc.id, ...c.payload.doc.data() }))),
// map result to true or false
map(res => {
      if (res[0].password === password) {
        return true;
      } else {
        return false;
      }
    })
);

那么当你想使用它时：

this.authenticationService.checkValidLogin(userName,password).subscribe(valid => {
  console.log(valid); // do your logic here of everything that determines if it's valid or not
});

Answer 2

请在this.userService.getUserByEmail 之前添加return，如下所示。

checkValidLogin(username: string, password: string){
return this.userService.getUserByEmail(username).snapshotChanges().pipe(map(data => data.map(c => ({ key: c.payload.doc.id, ...c.payload.doc.data() })))).subscribe(res => {
  if (res[0].password === password) {
    return true;
  } else {
    return false;
  }
});

我也建议只使用return res[0].password === password，因为它返回一个布尔值