订阅/可观察到引发错误-Angular2+

Question

我正试图从我观察到的函数中抛出一个错误，这样我就可以访问订阅的err部分，但我似乎无法访问该部分。

Answer 1

我不知道如何通过地图的方式来实现，但这里有一种不同的方式：

import { Observable, of, throwError } from 'rxjs';
ngOnInit() {
this.getObs().subscribe(data => {
console.log(data);
}, err => {
console.log(err);
});
}
getObs() {    
const observable = of(6);
const isError = true;
if (isError) {
return throwError("Is an error!");
}
return observable;
}

工作示例：https://stackblitz.com/edit/angular-mqp4qv?file=src/app/app.component.ts

Answer 2

我可以用几种方法来处理这个问题。以下是使用_throw的一种方法

// auth.ts
import { _throw } from 'rxjs/observable/throw';
login( username, password ) {
const body = this.jsonifyData( username, password );
return this.http.post<any>( this.apiBaseUrl + '/auth', body )
.pipe(
map( res => {
if ( 'token' in res ) {
return res.token;
}
// Unsuccessful login returns error
return _throw( res ); // from import {_throw} from 'rxjs/observable/throw';
} )
);
}

另一种方法是只捕捉登录组件中的错误

Answer 3

我认为在组件的测试规范中，您需要模拟authService和login过程。这个mock不进行http调用，只是在密码与某个预定义值不匹配时立即通过throwError(new Error('Either username or password were incorrect'))抛出错误。这里有一些关于如何测试组件http服务的例子，它有点过时，但在概念上仍然是实际的。