调用Angular路由器导航方法后，rxjs catchError运算符不传播错误
是因为在路由器导航方法中，错误被捕获并处理了，导致错误没有被传播到catchError运算符中。
在Angular中，路由器导航方法是用来导航到不同的路由页面的。当调用路由器导航方法时，可以通过订阅返回的Observable来处理导航过程中可能发生的错误。
通常情况下，可以在订阅Observable时使用catchError运算符来捕获和处理错误。catchError运算符会捕获Observable中的错误，并返回一个新的Observable，可以在其中处理错误或者提供默认值。
然而，在某些情况下，调用路由器导航方法后，catchError运算符可能无法传播错误。这可能是因为在路由器导航方法内部，错误被捕获并处理了，而不是抛出到调用方。
要解决这个问题，可以尝试以下几种方法：
- 在路由器导航方法中使用throw语句主动抛出错误，而不是在内部处理错误。这样可以确保错误能够被catchError运算符捕获到。
- 在路由器导航方法中返回一个带有错误信息的Observable，而不是在内部处理错误。这样可以让调用方自行处理错误。
- 检查路由器导航方法的文档或源代码，查看是否有其他参数或选项可以控制错误的传播行为。有些框架或库可能提供了特定的配置选项来控制错误的处理方式。
相关·内容
试图为rxjsv6.3.3导入catchError，但导入看起来不起作用。我在使用catch时出错了。
发现了类似的问题，但看上去对我没有帮助。
代码：
import { Injectable } from '@angular/core';
import { HttpClient, HttpErrorResponse } from '@angular/common/http';
import { IWinServices } from './WinServices';
import { Observable } from 'rxjs
浏览 0提问于2019-05-14得票数 2
回答已采纳
我正在尝试读取JSON配置文件，如下所示
this.http.get('assets/env/env.json').pipe(map( res => res.json())).pipe(catchError((error: any): any => {
console.log('Configuration file "env.json" could not be read');
return Observable.throw(error.json().error || 'Server error');
}
浏览 0提问于2020-09-02得票数 0
1回答
在我的项目中，单击按钮无法导航，出现异常：
core.es5.js:1020 ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'workarea/homepage'
Error: Cannot match any routes. URL Segment: 'workarea/homepage'
at ApplyRedirects.webpackJsonp.../../../router/@angular/router.es5.js.Apply
浏览 4提问于2018-01-25得票数 0
回答已采纳
从角度5到6(使用角度6和rxjs 6)，在我的林特中得到以下两个错误。任何人有任何想法，请和谢谢。
[ts] 'catchError' is declared but its value is never read.
[ts] Property 'catchError' does not exist on type 'Observable<HttpEvent<any>>'.
import { Injectable, Injector } from '@angular/core';
import { Htt
浏览 96提问于2018-06-07得票数 3
回答已采纳
1回答
我有一个效果，我需要传递一个ID，我从我的URL。
我有一个根存储有我的路由器存储，我有另一个存储，我使用我的组件，来加载一些数据。
1.如何从我的效果中的路由器商店访问URL params？
2.从组件效果中可以访问根存储中的数据吗？
3.现在我有24322的硬代码，我需要从我的根存储中得到它。我是从我的效果得到它，还是在有效载荷上传递它更好？*
这是我的组件效果的代码
import { Injectable } from '@angular/core';
import { Effect, Actions, ofType } from '@ngrx/effects&
浏览 1提问于2019-05-10得票数 1
回答已采纳
我试图捕捉来自HTTP请求的错误，并且基于错误代码向user.To显示错误消息，实现这一点，我使用来自rxjs的catchError操作符。
但是我得到了这样的错误：属性'catchError‘在可观察的< Response >类型上不存在
折叠是我的package.json
"dependencies": {
"@angular/animations": "^6.0.3",
"@angular/common": "^6.0.3",
"@angular/compiler": &#
浏览 0提问于2018-07-19得票数 2
回答已采纳
我有一个事件发射器testEvent。testEvent有一个管道链，在这个链中抛出了一个错误。但我也在链中的两个地方捕捉到了错误。尽管如此，我的testEvent还是会自动退订。
有人能解释一下原因吗？
import { Component, EventEmitter } from '@angular/core';
import {map} from 'rxjs/operators';
import {catchError, switchMap} from 'rxjs/internal/operators';
import {forkJoin
浏览 0提问于2019-08-22得票数 3
我不喜欢像by ngrx这样的官方指南。我想为auth创建我的第一个存储对象。我想，如果我从logout逻辑开始，我可以更好地理解逻辑并提高我的技能。 作为零步骤，我为http请求http-auth.service.ts创建服务 import { HttpClient, HttpErrorResponse } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { throwError, Observable } from 'rxjs';
浏览 5提问于2020-05-03得票数 0
我正在开发一个拦截器来处理角10项目中的http错误。以下是代码：
import { HttpEvent, HttpHandler, HttpInterceptor, HttpRequest, HttpResponse } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Observable, of } from 'rxjs';
import { catchError, map } from 'rxjs/operators&
浏览 4提问于2020-12-31得票数 0
2回答
我试图在服务文件中捕获HTTP消息中的错误。
下面是脚本：
import { Injectable } from '@angular/core';
import { PortfolioEpicModel, PortfolioUpdateStatus } from '../models/portfolio-epic.model';
import { HttpClient, HttpErrorResponse, HttpParams} from '@angular/common/http'
import { config, Observable }
浏览 1提问于2021-08-06得票数 0
1回答
我的目标是在发生内部服务器错误时添加通用错误警报。下面是我的错误拦截器文件。
import { Injectable } from '@angular/core';
import { HttpInterceptor, HttpErrorResponse} from '@angular/common/http';
import { throwError} from 'rxjs';
import { catchError } from 'rxjs/operators';
import { AlertService } from
浏览 1提问于2018-12-31得票数 0
回答已采纳
我试着用角大学提供的很好的例子实现一个角数据表。但我被困在实现我的数据源上。这是我的资料来源：
import { Aircraft } from '../shared/aircraft';
import { AircraftInfoService } from './aircraft-info.service';
import { BehaviorSubject } from 'rxjs';
import { CollectionViewer, DataSource } from '@angular/cdk/collections'
浏览 0提问于2019-03-09得票数 6
回答已采纳
1回答
我试图在我的一个http帖子中使用超时值。我得到的错误是
ERROR TypeError: this._http.post(...).timeout is not a function
代码如下所示：
return this._http.post(this.meetingProcessURL, body )
.timeout(5000)
.catch( err => {
return Observable.throw("Timeout has occurred");
})
.pipe(catchError(this.handleError)
浏览 1提问于2018-11-27得票数 1
回答已采纳
当前行为: AuthGuard似乎根本不会触发，导航到/dashboard可以工作，但会留下一个空白屏幕，甚至不会对可观察对象执行console.log操作，也不会触发重定向。 预期行为:导航到/dashboard应触发AuthGuard并重定向到/login。 auth.service.ts import { HttpClient, HttpHeaders, HttpParams } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { catchE
浏览 18提问于2020-12-23得票数 0
我该如何解决这个问题？
Angular CLI: 14.0.2
Node: 16.13.0
rxjs: 7.5.5
typescript: 4.7.4
我的进口品：
import { Observable, BehaviorSubject } from "rxjs";
import { first, catchError, tap } from "rxjs/operators";
在first()上出错，
login(
email: Pick<User, "email">,
password: Pick<
浏览 9提问于2022-07-03得票数 -1
回答已采纳
2回答
我正在使用angular 7。这是我的服务。 get(){
return this.http.post(this.url).pipe(
catchError(this.handleError)
)
} 这是错误处理程序代码。 handleError(errorResponse: HttpErrorResponse) {
if (errorResponse.error instanceof ErrorEvent) {
return throwError(errorResponse.error.message)
} else {
switch (error
浏览 28提问于2019-02-06得票数 0
这是一个服务文件：
import { Injectable } from '@angular/core';
import { Http, Response } from "@angular/http";
import {map, catchError} from 'rxjs/operators';
import { Observable } from "../../node_modules/rxjs";
@Injectable({
providedIn: 'root'
})
export class Sess
浏览 1提问于2018-08-15得票数 0
我有一个下拉导航栏，每个选项都有不同的路由器链接。当用户搜索时，我希望记住搜索类型和搜索筛选器值，并在用户再次导航到搜索选项时显示以前的值。我正在使用一个服务来使搜索类型和搜索筛选器值在整个应用程序中可用，但我无法使其工作。当我导航回搜索时，搜索类型和搜索筛选器值被初始化。你能告诉我我错过了什么吗..。
app.component.ts:
-----------------
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl:
浏览 0提问于2018-05-03得票数 1
我正在实现一个Anguar拦截器，以便从服务器返回的任何带有401错误的请求都应该导航回登录页面，而我正在接收这个错误。
错误TypeError:无法读取未定义的属性“”navigate“”
为什么我会得到这个错误？
import { Injectable, InjectionToken } from '@angular/core';
import { HttpInterceptor, HttpHandler, HttpRequest, HttpEvent, HttpHeaders, HttpResponse, HttpErrorResponse } from '@an
浏览 1提问于2019-04-17得票数 1
我创建了一个带有角6的新项目，但是当我试图添加我的http请求时，.subscribe会出现一个错误。我只能为以前版本的角找到解决方案。有人能帮忙吗？
产品服务
import {Injectable} from "@angular/core";
import {Http,Response} from "@angular/http";
import {Observable} from "rxjs";
import { map, catchError } from 'rxjs/operators';
@Injectable()
ex
浏览 1提问于2018-08-07得票数 0
回答已采纳
在我的应用程序从角5迁移到6之后，rxjs引起了各种各样的问题。在迁移过程中和移除之后，我使用了rxjs-紧凑，因为它会导致更大的内存利用率。我被留下了这样的错误。
./node_modules/rxjs-compat/_esm5/add/operator/publishReplay.js模块构建中的错误失败:错误: ENOENT:没有这样的文件或目录，打开'/home/training/Desktop/vishnu/TemplateAppv6/node_modules/rxjs-compat/_esm5/add/operator/publishReplay.js‘
我尝试过从
浏览 0提问于2018-09-25得票数 1
回答已采纳
3回答
我使用的离子引擎盖下的角度。
设置
"@angular/router": "~9.1.9",
"@ionic/angular": "^5.1.1",
"rxjs": "^6.5.5",
我使用下面的登录方法:当它被触发时，旋转器被显示，数据被加载，路由到另一个页面，然后旋转器再次被隐藏。
loginWithGoogle() {
this.showSpinner = true;
this.authService.getAuthSessionPersistence()
.
浏览 4提问于2020-06-07得票数 0
import { Injectable } from '@angular/core';
import { HttpClient, HttpErrorResponse } from '@angular/common/http';
import { Observable } from 'rxjs';
import { catchError } from 'rxjs/operators';
@Injectable()
export class ApiService {
co
浏览 6提问于2019-03-13得票数 2
我被rxjs catchError操作符弄糊涂了。下面是一个使用角的简单示例：
(现场演示)
import { Component } from '@angular/core';
import { of, timer } from 'rxjs'
import { tap, catchError } from 'rxjs/operators'
@Component({
selector: 'my-app',
templateUrl: './app.component.html',
})
export cla
浏览 0提问于2019-06-24得票数 6
回答已采纳
1回答
我试着添加了一个authGuard on Nativescript杂货教程。基本上我有一个登录页和一个列表页面，我的应用程序在列表页面上着陆，但是，如果用户没有登录(没有令牌)，它会把你送到登录页面。问题是，当我按下sign in时，它什么也不做，也没有得到任何错误。
这是AuthGuard：
import { Injectable } from "@angular/core";
import { CanActivate, Router } from "@angular/router";
import { UserService } from "../s
浏览 1提问于2018-09-19得票数 0
下面是我在book.service.ts中的代码：
import { Injectable } from '@angular/core';
import { Http, Response } from '@angular/http';
import {Observable} from 'rxjs';
import { Book } from './book';
import { map } from "rxjs/operators";
import { catchError } from 'rxjs/ope
浏览 2提问于2018-05-30得票数 6
1回答
在Angular 2 RCla.发布之后，引入了路由器解析。使用Promise的演示示例，如果我使用Observable向服务器发出请求，如何做同样的事情？
search.service.ts
searchFields(id: number) {
return this.http.get(`http://url.to.api/${id}`).map(res => res.json());
}
search-resolve.service.ts
import { Injectable } from '@angular/core';
import { Router, Re
浏览 0提问于2016-08-22得票数 32
回答已采纳
1回答
我想处理超时错误时，效果作出一个Http请求。 这是我的效果 loadSchedulings$ = createEffect(() =>
this.actions$.pipe(
ofType(ESchedulesActions.GetSchedulesByDate),
mergeMap(() =>
this.apiCallsService.getSchedulings().pipe(
map(trips => ({ type: ESchedulesActions.GetSchedulesByDateSuccess, paylo
浏览 14提问于2020-01-28得票数 0
回答已采纳
1回答
我有一个问题，当使用最新版本的rxjs与角6。代码；
import { Observable, throwError } from "rxjs";
import { map, filter, catchError, mergeMap } from 'rxjs/operators';
isValidUser(user, password) : Observable<any> {
let urlString = "http://localhost....=" + user + "&password=" + pa
浏览 0提问于2018-06-14得票数 2
回答已采纳
我收到了一个错误，因为：
Type 'Observable<void | PostProps[]>' is not assignable to type 'Observable<PostProps[]>'. Type 'void | PostProps[]' is not assignable to type 'PostProps[]'. Type 'void' is not assignable to type 'PostProps[]'.ts(2322)
但我会回复的。但
浏览 5提问于2022-10-27得票数 -1
回答已采纳
我得到了这个错误。我在试着用 import { catchError } from 'rxjs/operators' 而不是 import 'rxjs/add/operator/catch' 但是如何使用rxjs/add/operator/do和rxjs/add/operator/toPromise的instaed呢
浏览 9提问于2020-10-07得票数 3
我的"posts.service.ts“中有以下导入
import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { NotFoundError } from '../commons/errors/not-found-error.errors';
import { AppErrors } from '../commons/errors/app-errors.errors';
imp
浏览 1提问于2018-06-04得票数 8
回答已采纳
1回答
我正在尝试将用户定向到httpClient.post请求的response中的仪表板。页面导航“很好”(显示在url栏上)，但组件DOM的大多数元素不会加载。 这是service.ts上的帖子： import { Injectable } from '@angular/core';
import { HttpClient, HttpErrorResponse, HttpHeaders } from '@angular/common/http';
import { Observable, throwError } from 'rxjs';
imp
浏览 22提问于2020-12-27得票数 0
我在试着让一个全局的HTTP拦截器工作。 我们有两个拦截器，一个用于客户端错误，下面用于服务器端错误。 我想尝试抛出一个HttpErrorResponse类型的错误，这样客户端错误捕获器就不会捕捉到这个错误。 但是，对于下面的代码，TypeScript编译器会抛出以下错误： Error: errors/http-error.interceptor.ts:26:37 - error TS2345: Argument of type 'HttpErrorResponse' is not assignable to parameter of type '{ error?:
浏览 77提问于2021-08-16得票数 0
我有getNewToken和hasTheUserTokenOrPermission方法。第一个返回token并设置用户数据，第二个在我们设置用户数据后进行检查-如果他有权限查看守卫中的某些内容。 所以我需要等待第一个结果，然后检查是否有权限。我需要从canActivateGuard返回true或false。 所以这个问题可以用promise pattern这样来解决 import { Injectable } from '@angular/core';
import { ActivatedRouteSnapshot, CanActivate, RouterStateSnaps
浏览 25提问于2021-04-13得票数 0
2回答
当从后台收到409错误时，我希望显示后台开发人员提供给我的响应消息。
我这样做
return this.http.post('url to API', data, {
reportProgress: true,
observe: 'events'})
.pipe(
map(
res => {
return res;
}
),
catchError((error) => {
return
浏览 12提问于2018-08-15得票数 0
3回答
在初始化MatchComponent时，我想做1. Get请求获取Match对象(Match对象有一个成员playerIDs) 2. get请求获取球员(基于Match对象中的playerID)
由于异步通信，我的下面的代码不能工作。我该怎么处理呢？
match.component.ts
@Component({
selector: 'app-match',
templateUrl: './match.component.html',
styleUrls: ['./match.component.css']
})
export cla
浏览 0提问于2019-11-07得票数 1
我在组件中导入我的ApiService时遇到了问题。我刚刚用ng new创建了一个新的应用程序，并使用CLI创建了一个API服务。一切正常，但是一旦我在组件中导入服务，我就会得到错误：
Can't resolve all parameters for MainComponent in <project_location>/src/app/main/main.component.ts
我又犯了一次错误，但再也没有出现过：
ERROR in node_modules/@angular/http/http.d.ts(1,1): error TS6053: File '&l
浏览 2提问于2018-12-19得票数 0
回答已采纳
我正在使用Ionic 4开发一个带有角的应用程序，我得到了以下错误：
VM1190 vendor.js:51847 ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'null'
Error: Cannot match any routes. URL Segment: 'null'
at ApplyRedirects.push../node_modules/@angular/router/fesm5/router.js.ApplyRedirec
浏览 2提问于2019-10-18得票数 0
我试图向发出http请求。API返回字符串值(“成功”或“失败”).但是我不知道如何在调用API时将响应类型设置为字符串值..其抛出错误作为后端返回的代码200，body是: object Object
我的角度代码如下，
order.service.ts
import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { ProductSearch } from '../_models/p
浏览 0提问于2018-06-11得票数 70
回答已采纳
使用Angular 6.1和RxJs6，我正在尝试为单个用户上的组件实现一个解析器。
我的userService http调用是这样的：
getUserById(id: string): Observable<AppUser> {
return this.http.get<AppUser>(this.baseURL + id, httpOptions);
}
还有我的解决器：
import { Injectable } from "@angular/core";
import { Resolve, Router, ActivatedRouteSn
浏览 0提问于2019-05-31得票数 0
1回答
我正在测试一个Http拦截服务，它使用路由导航到另一个url，当它返回一个错误响应时，我的所有测试目前都通过了，因为我没有测试路由本身，但是在我的控制台上出现了一个异常。
Unhandled Promise rejection: Cannot match any routes. URL Segment: 'login' ; Zone: ProxyZone ; Task: Promise.then ; Value: Error: Cannot match any routes. URL Segment: 'login'
我曾尝试在navigateByUrl函数上对
浏览 4提问于2019-12-11得票数 0
以前，我只能使用以下代码导入使用的运算符：
import 'rxjs/Observable';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/mergeMap';
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/finally';
import 'rxjs/add/observable/empty';
import 'rxjs/add/observab
浏览 1提问于2018-05-19得票数 3
我正在将我的应用程序从角5升级到角8。我已经创建了一个HttpInterceptor，但是我得到了以下错误：
ERROR next.handle不是函数(core.js)。
我已经检查过HttpClientModule只加载了一次，所以我不知道是什么导致了这个问题。
你能帮我修一下吗？
import { HttpEvent, HttpHandler, HttpInterceptor, HttpRequest } from '@angular/common/http';
import { Injectable } from '@angular/core';
i
浏览 3提问于2019-11-19得票数 0
RxJS 5.5允许抓取lettable运算符，并像这样对它们进行管道处理：
import { ajax } from 'rxjs/observable/dom/ajax'
import { catchError, map, retry } from 'rxjs/operators'
ajax.getJSON('https://example.com/api/test')
.pipe(
retry(3, 1000),
map(fetchUserFulfilled),
catchError(console.error)
)
浏览 4提问于2017-12-30得票数 9
回答已采纳
我正在尝试在我的angular应用程序中构建一个错误拦截器。我通过构造函数将auth服务导入其中。但是当我从它调用一个方法时，我得到了一个错误，它不存在。这是拦截机。
import {Injectable } from '@angular/core';
import {
HttpEvent, HttpInterceptor, HttpHandler, HttpRequest, HttpErrorResponse
} from '@angular/common/http';
import { AuthService } from '../aut
浏览 27提问于2020-06-01得票数 0
回答已采纳
1回答
我在catchError中使用了rxjs，并且熟悉pipe流中使用的pipe操作符，特别是对于HttpClient (XHR)调用
我的问题是catchError操作是如何工作的？它是如何捕捉引擎盖下的错误的？
import { throwError, of } from 'rxjs';
import { catchError } from 'rxjs/operators';
//emit error
const source = throwError('This is an error!');
//gracefully handle erro
浏览 0提问于2018-12-01得票数 2
回答已采纳
1回答
我正在构建一个带有简单身份验证和GET请求的后端的应用程序。我想向用户显示一个对话框，以便在他们的身份验证到期时重新输入他们的密码。当您输入密码并单击submit时，我希望重新尝试原始的Observable调用，并在原始Observable中获取数据。我想这是可能的，但我似乎找不到一个开始的方法。
这个问题类似：
但是我使用的是.pipe()和catchError，所以我可以订阅API服务中的函数，而不是单独的http调用。我不知道我应该提供什么其他的信息来澄清我的问题，但请告诉我是否还有什么需要知道的。
这是我目前的代码：
import { Injectable } from "@a
浏览 0提问于2018-03-02得票数 2
回答已采纳
我正尝试在我的http.service.ts文件中执行REST调用。我使用的是Angular版本7和RxJS。我想要获取json的cod值。我正在对openweather API进行REST调用。当我添加map()来获得所需的值时，它不起作用。只有在没有map()的情况下，它才能工作。我遗漏了什么？ 我的代码： import { Injectable } from '@angular/core';
import { environment } from 'src/environments/environment';
import { HttpClient }
浏览 28提问于2020-01-17得票数 0
我正在尝试从mongodb中获取一些数据，并继续获取以下错误：
“OperatorFunction”类型上不存在属性“订阅”
//app.Compent.ts
import { Component } from '@angular/core';
import {FormGroup, FormControl, Validators, FormsModule} from '@angular/forms';
import {CommonService} from './common.service';
import {Http, Respons
浏览 0提问于2019-06-28得票数 2
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
云直播
对象存储活动推荐
腾讯云开发者
