Javascript 角度4-从服务到组件捕获err对象

我正在使用angular作为前端，spring security作为后端的登录页面上工作，一切似乎都很正常，但当我试图通过捕获从服务到组件的错误来处理异常时，却无法工作

服务.ts

 login(form) {
      var objectToSend = 'j_username=' + form.j_username + '&j_password=' + form.j_password;
      const headers = new Headers(
        {
          'Content-Type': 'application/x-www-form-urlencoded',
        }
      );
      const options = new RequestOptions({headers: headers, withCredentials: true});
      return this.http.post('http://localhost:8080/***********/authenticate', objectToSend, options)
        .map((res) => res)
        .catch((error: any) => {
          if (error.status === 401) {
            console.log(error.status + ' is the current status');
            return Observable.throw(new Error(error.status));
          } else if (error.status === 400) {
            return Observable.throw(new Error(error.status));
          } else if (error.status === 409) {
            return Observable.throw(new Error(error.status));
          } else if (error.status === 406) {
            return Observable.throw(new Error(error.status));
          }
        });
    }

     loginProcess() {
      this._authenticationService.login(this.form.value).subscribe(
        res => {
          this.data = res;
          if (res.status === 200) {
            this._authenticationService.getRoles().subscribe(
              resp => {
                if (resp.status === 200) {
                  this.roles = JSON.parse(resp.text());
                  this.role = this.roles[0].authority;
                  localStorage.setItem('role', this.role);
                  this.connectedUser.eusLogin = this.form.value.j_username;
                  this.saveConnectedUser(this.connectedUser);
                  this.updateSessionTimeOut();
                  if (this.role === 'ROLE_ADMIN') {
                    this._router.navigate(['home']);
                  }
                } else {
                  this.showErrorMsgDetail = true;
                  this.error = true;
                }
              },
              error => {
                this.error = true;
              }
            );
          } else {
          }
        },
        err => {
          if (err.status === 401) {
            this.showErrorMsgDetail = true;
            this.errorMsgDetail = 'Bad credentials, try again';
          }
        }
      );
    }

login.component.ts

 login(form) {
      var objectToSend = 'j_username=' + form.j_username + '&j_password=' + form.j_password;
      const headers = new Headers(
        {
          'Content-Type': 'application/x-www-form-urlencoded',
        }
      );
      const options = new RequestOptions({headers: headers, withCredentials: true});
      return this.http.post('http://localhost:8080/***********/authenticate', objectToSend, options)
        .map((res) => res)
        .catch((error: any) => {
          if (error.status === 401) {
            console.log(error.status + ' is the current status');
            return Observable.throw(new Error(error.status));
          } else if (error.status === 400) {
            return Observable.throw(new Error(error.status));
          } else if (error.status === 409) {
            return Observable.throw(new Error(error.status));
          } else if (error.status === 406) {
            return Observable.throw(new Error(error.status));
          }
        });
    }

     loginProcess() {
      this._authenticationService.login(this.form.value).subscribe(
        res => {
          this.data = res;
          if (res.status === 200) {
            this._authenticationService.getRoles().subscribe(
              resp => {
                if (resp.status === 200) {
                  this.roles = JSON.parse(resp.text());
                  this.role = this.roles[0].authority;
                  localStorage.setItem('role', this.role);
                  this.connectedUser.eusLogin = this.form.value.j_username;
                  this.saveConnectedUser(this.connectedUser);
                  this.updateSessionTimeOut();
                  if (this.role === 'ROLE_ADMIN') {
                    this._router.navigate(['home']);
                  }
                } else {
                  this.showErrorMsgDetail = true;
                  this.error = true;
                }
              },
              error => {
                this.error = true;
              }
            );
          } else {
          }
        },
        err => {
          if (err.status === 401) {
            this.showErrorMsgDetail = true;
            this.errorMsgDetail = 'Bad credentials, try again';
          }
        }
      );
    }

问题在于在组件级别捕获从服务到组件的响应代码。错误状态未定义

---

希望你们能弄明白这一点。

您正在尝试在没有任何事件发射器或行为的情况下进行通信subject您希望如何在其他地方捕获错误

您必须捕获服务中的错误，将其注入构造函数中的登录组件中，然后只需使用此.myService.getDataFromWebService（post）从组件调用您的服务

getDataFromWebService（postData:Kpi）：EventEmitter{
常量事件：EventEmitter=新的EventEmitter（）；
this.sendPost（myService.API_路径，postData）.subscribe（（数据）=>{
试一试{
如果（此检查错误（数据））{
const parseData:Kpi=Kpi.parse（数据）；
emit（解析数据）；
}否则{
event.emit（新Kpi（））；
}
}捕获（ex）{
此环境错误（“未知错误”，“接收到无效数据”）；
console.log（“异常”，ex）；
发出（新的Kpi（））；
}
});
返回事件；
}

您能再显示一点组件代码吗？