类型 'void' 不可分配给类型 'ObservableInput<{}>'

Question

这个错误在我迁移到 TS 2.2.2 后开始弹出，所以我假设这是问题所在...代码没有停止工作，但现在我收到了那个错误，我尝试了一些东西就像 returning 一个空的 observable，捕获重新抛出的异常和 returning 一个对象，似乎没有任何效果。为什么现在会这样？它不应该理解我正在重新抛出异常而不是期望 return 吗？我是不是误读了错误？

这是完整的错误描述：

完整代码如下：

return request
    .map((res: Response) => res.json())
    .catch((error: any) => {
        // todo: log?

        if (error.status == 500) {
            this.alertService.showError(error.statusText);
        } else if (error.status == 588) {
            this.alertService.showAlert(error.statusText);
        }

        Observable.throw(error.statusText);
    });

我尝试了 returning Observable，但是我的包装器方法需要一个类型为 T 的 return，这是我的反序列化请求的 return（map(...)).如果我做 return throw 这是我得到的错误：

[ts] Type 'Observable' is not assignable to type 'T'

我正在使用：

Angular4

Typescript 2.2.2

Answer 1

你必须 return Observable

 return request
    .map((res: Response) => res.json())
    .catch((error: any) => {
        // todo: log?

        if (error.status == 500) {
            this.alertService.showError(error.statusText);
        } else if (error.status == 588) {
            this.alertService.showAlert(error.statusText);
        }

        return Observable.throw(error.statusText);
    });

Answer 2

有时当你调用 catch 时不使用箭头函数，如下所示

getUserList() {
    return this.http.get(this.constURL + '/api/url/here', this.headerOptions)
    .catch(this.handleError);
}

handleError(error: Response) {
    if (error.status == 500) {      
      this.router.navigate(['/login']);
    } else {
      return Observable.throw(error);
    }
}

然后它给出

的错误

错误类型错误：无法读取未定义的属性 'navigate' 没有得到这个

因为在 handleError 函数中这个对象是不可访问的..如果你控制 this.router 那么你会得到 undefined.. 所以这个对象不工作并且没有得到路由器所有可用的方法

所以你必须像下面这样使用箭头函数

getUserList() {
    return this.http.get(this.constURL + '/api/url/here', this.headerOptions)
    .catch(error => { 
      return this.handleError(error);
    });
}

handleError(error: Response) {
    if (error.status == 500) {      
      this.router.navigate(['/login']);
    } else {
      return Observable.throw(error);
    }
}

此外，如果您没有为 handlerError 函数提及 return，那么它将再次抛出错误，例如

“(error: any) => void”类型的参数不可分配给类型

的参数

因此有必要为 handlerError 函数键入 return。

检查 here for in detail.He 已经很好地解释了所有可能的错误和解决方案的代码..对我有用

Answer 3

这是 angular 6 和 RXJS 6 的答案。在您的请求函数中，它看起来与此类似。请注意，catch 已替换为 catchError，Observable.throw 现在是 throwError。同样在 RXJS 6 中，我们使用管道将我们希望执行的一系列函数连接在一起，而不是以前的点链接。

//In your service

getData(url: string): Observable<any> {
    let options = this.getHTTPOptions();
    return this.http.get<any>(url, options).pipe(
          catchError( (err: any, caught: Observable<any>) => { return 
        throwError(this.generalErrorHandler(err, caught)) } ) );
}

然后你可以有一个错误处理程序。关键是在上面的 catchError 函数和 return 处理程序中的错误中都指定关键字 return。箭头 ( => ) 允许您将调用函数的上下文传递给错误处理程序，这意味着您可以做一些很酷的事情，例如 this.router.navigate(['someroute']); （如果您在服务中导入了路由器）

//In your service

  generalErrorHandler(error: any, caught: Observable<any>): Observable<any> {
    console.log('error caught: ', error);
    if( error.error.status == "INVALID_TOKEN" || error.error.status == "MAX_TOKEN_ISSUE_REACHED"){
      console.log('token has expired');
      this.logout();
      return error;
    }
    return error;
  }

一些关键的导入来让它工作：

//Imports for the service

import { HttpClient, HttpHeaders, HttpErrorResponse } from '@angular/common/http';
import { Http, Response } from '@angular/http';
import { catchError, map } from 'rxjs/operators';
import { Observable, throwError, of} from 'rxjs';

最后订阅获取数据的请求：

//In your component, don't forget to import your service

let response$ = this.someService.getData('url here');
response$.subscribe( 
    data => { console.log('do stuff to data here', data); },
    err => { console.log("couldn't get data, maybe show error to user"); },
    () => { console.log('function that is called upon finish'); }
);

Answer 4

 return Observable.throw(error);

可观察对象。 throw 已弃用在拦截器中使用这样的 throwError 运算符

intercept(request: HttpRequest<unknown>, next: HttpHandler): Observable<HttpEvent<unknown>> {
   return next.handle(request).pipe(
    catchError(err => {
      if (err.status === 401) {
       // remove Bearer token and redirect to login page
        this.router.navigate(['/auth/login']);
      }
      return throwError( err );
    }));
}

类型 'void' 不可分配给类型 'ObservableInput<{}>'

Type 'void' is not assignable to type 'ObservableInput<{}>'

typescript

angular4