Question

我有一个登录功能，我想捕获服务器启动的异常，并将它们冒泡到视图中，并显示错误消息。到目前为止，我使用promise来处理异步部分，我想使用catch()部分来捕获我的异常。问题是handler函数永远不会被调用，我在浏览器控制台中收到错误。到目前为止，这是我的代码，非常基本：

login(username: string, password: string): Promise<User> {

    return this.http
      .get(this.loginUrl + '?username=' + username + '&password=' + password)
      .toPromise()
      .then(response => response.json())
      .catch(function(e){
          this.handler(e);
      })
  }

  handler (e: Response){
    throw e;
  }

我错过了什么吗？感谢。

修改我建议使用arrow function，现在我的代码如下：

user.service.ts

login(username: string, password: string): Promise<User> {

    return this.http
      .get(this.loginUrl + '?username=' + username + '&password=' + password)
      .toPromise()
      .then(response => response.json())
      .catch(e => {
          this.handler;
      })
  }

  handler (e: Response){
    throw e;

  }

login.component.ts

onSubmit(loginForm: NgForm): string {

    this.userService.login(loginForm.value.username, loginForm.value.password)
    .then(data => {

      this.message = 'Nome: ' + data.nome +
                    ' Cognome: ' +data.cognome + 
                    ' Azienda: ' + data.azienda +
                    ' Ufficio: ' + data.ufficio;
    })
    .catch(e => {
        this.message = e;
      });

    return this.message;
  }

尽管如此，我从服务器获取异常，但应用程序会跳过catch()块。

Answer 1

这不是你应该如何使用箭头功能，而不是你处理async请求的方式。首先，您确实不应该使用function关键字，而是使用箭头符号。但是在你的捕获声明中，你不能发起handler功能。

另一方面，您试图在onSubmit中返回一个字符串。但获取此字符串的方法是async。您可以利用TypeScript await和async功能。

user.service.ts

login(username: string, password: string): Promise<User> {

    return this.http
      .get(this.loginUrl + '?username=' + username + '&password=' + password)
      .toPromise()
      .then(response => response.json())
      .catch(this.handler)
}

handler = (e: Response) => {
    throw e;
};

注意箭头功能分配。

<强> login.component.ts

async onSubmit(loginForm: NgForm): Promise<string> {

    try {
       const data: any = await this.userService.login(loginForm.value.username, loginForm.value.password);
       this.message = `Nome: ${data.nome} Cognome: ${data.cognome} Azienda: ${data.azienda} Ufficio: ${data.ufficio}`;
    } catch (e) {
       this.message = e;
    }    

    return this.message;
}

请注意，您的onSubmit现在返回Promise<string>

Angular promise不会捕获异常

1 个答案: