繁体   English   中英

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

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

提示:本站收集StackOverFlow近2千万问答,支持中英文搜索,鼠标放在语句上弹窗显示对应的参考中文或英文, 本站还提供   中文繁体   英文版本   中英对照 版本,有任何建议请联系yoyou2525@163.com。

这个错误在我迁移到 TS 2.2.2 后开始出现,所以我假设这就是问题所在......代码没有停止工作,但现在我收到了这个错误,我尝试了一些事情,比如返回一个空的 observable ,捕获重新抛出的异常并返回 object,似乎没有任何效果。 为什么现在会发生这种情况? 难道它不应该理解我正在重新抛出异常并且不期望返回吗? 我误读了错误吗?

这是完整的错误描述:

在此处输入图像描述

这是完整的代码:

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);
    });

我尝试返回 Observable,但我的包装方法需要返回类型T ,这是我的反序列化请求( map(...) )的返回。 如果我确实返回throw这是我得到的错误:

[ts] 类型 'Observable' 不可分配给类型 'T'

我在用着:

  • 角4
  • Typescript 2.2.2
5 个回复

你必须返回 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);
    });

有时,当您在不使用箭头函数的情况下调用 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);
    }
}

然后它给出了错误

错误类型错误:无法读取未定义的属性“导航”没有得到这个

因为在 handleError 函数中,这个对象是不可访问的。

所以你必须在这里使用箭头函数,如下所示

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 函数的返回值,那么它会再次抛出错误,例如

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

所以有必要为 handlerError 函数输入 return 。

在这里查看详细信息。他很好地解释了代码,其中包含所有可能的错误和解决方案..对我有用

这是 RXJS 6 的 angular 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 ,并在处理程序中返回错误。 箭头 ( => ) 允许您将调用函数的上下文传递给错误处理程序,这意味着您可以做一些很酷的事情,例如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'); }
);
 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 );
    }));
}

目前使用 Angular 14 您可以使用Error(err.error.message); 问题已经解决了。

例子:

 handleError(err: any): Observable<any> {return new Error(err.error.message);}

4 switchMap类型void不能分配给ObservableInput <{}>类型

我使用Angular http和RXJS来检索一些应用程序设置。 http使用RXJS shareReplay来避免多个相同的调用。 这是按预期工作,并检查网络选项卡我只能看到我的后端API调用。 我的应用程序中的一些组件将调用该服务并使用结果来呈现页面。 其他组件,需要像上面那 ...

5 Angular 6 RxJS6类型“ void”不能分配给类型“ ObservableInput <{}>”

我正在将代码转换为使用RxJS6语法来使用管道和地图,但出现错误。 现有的代码工作正常,但是我遇到的问题是,在返回结果之前,必须调用其他方法。 因此,据我了解,使用管道和地图将解决此问题。 这是我最初的代码: 这是我尝试转换为使用管道和地图的代码: 我已经进口了其他进口 ...

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2022 STACKOOM.COM