Angular 使用图标4进行身份验证，失败消息获胜'；t显示

我试图向用户显示登录失败的消息，但我只能在成功登录后执行操作。下面的if语句仅在登录成功时运行。如何插入else，以便设置一个标志来告诉用户登录失败

**编辑的代码：现在可以正常工作了

//auth.service.ts
@Injectable({
  providedIn: 'root'
})
export class AuthService {

  AUTH_SERVER_ADDRESS:  string  =  'http://localhost:3000';
  authSubject  =  new  BehaviorSubject(false);

  constructor(private httpClient: HttpClient, private storage: Storage, public alertController: AlertController) { }

  login(user: User): Observable<AuthResponse> {
    return this.httpClient.post(`${this.AUTH_SERVER_ADDRESS}/login`, user).pipe(
      tap(async (res: AuthResponse) => {
        if (res.user) {
          await this.storage.set("ACCESS_TOKEN", res.user.access_token);
          await this.storage.set("EXPIRES_IN", res.user.expires_in);
          this.authSubject.next(true);
        }
      })
    )
  }

在我的登录页面上，我想向用户显示登录失败时的错误：

//login.page.html
<div *ngIf="showError">Error: {{errorMessage}}! Please try again</div>

//login.page.html
错误：{{errorMessage}}！请再试一次

---

**编辑，登录页面现在将显示我想要的错误。我永远无法得到下面的可观察建议。

当您找到数据时，您可以让auth服务中的登录函数返回一个观察者。如果您找不到数据，观察者将向您页面上的登录函数返回一个错误。传递数据时，可以使用

observer.complete（）

//auth.service.ts
登录（用户：用户）：可观察{
返回新的可观察对象（观察者=>{
this.httpClient.post（`this.AUTH\u SERVER\u ADDRESS}/login`，user）.pipe(
点击（异步（res:AuthResponse）=>{
if（res.user）{
等待这个.storage.set（“ACCESS\u TOKEN”，res.user.ACCESS\u TOKEN）；
等待这个.storage.set（“EXPIRES\u IN”，res.user.EXPIRES\u IN）；
observer.next（true）；//将数据发送到登录页-订阅
observer.complete（）；//关闭可观察
}否则{
observer.error（）；//向登录页发送错误-错误
}
});
});
);

您可以从

observer.next（）

访问结果，并从

observer.error（）访问错误

登录（表单）{
this.authService.login（form.value）.subscribe(
结果=>{
this.router.navigateByUrl（`home`）；
},
错误=>{
this.ror=true；
});
}
我们在哪里可以找到
this.authSubject
？它在auth.service.ts（添加到相关代码中）中。我在observer上收到一个错误。下一步（true）；它说true不可分配给AuthResponse。我接受这个答案，因为我使用了登录（表单）为了得到正确的结果而编写代码。我从来没有让可观察到的代码工作过。
//login.page.html
<div *ngIf="showError">Error: {{errorMessage}}! Please try again</div>