在Angular中,可以使用拦截器来基于响应将路由到不同的路径。下面是一个示例代码:
首先,创建一个名为response-interceptor.ts
的拦截器文件,其中包含以下代码:
import { Injectable } from '@angular/core';
import { HttpInterceptor, HttpRequest, HttpHandler, HttpEvent } from '@angular/common/http';
import { Observable } from 'rxjs';
import { tap } from 'rxjs/operators';
import { Router } from '@angular/router';
@Injectable()
export class ResponseInterceptor implements HttpInterceptor {
constructor(private router: Router) {}
intercept(request: HttpRequest, next: HttpHandler): Observable> {
return next.handle(request).pipe(
tap(response => {
// 假设当响应的状态码为200时,路由到"/success"路径
if (response.status === 200) {
this.router.navigate(['/success']);
}
})
);
}
}
然后,在app.module.ts
文件中,将拦截器添加到提供者列表中:
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';
import { AppComponent } from './app.component';
import { ResponseInterceptor } from './response-interceptor';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
HttpClientModule
],
providers: [
{
provide: HTTP_INTERCEPTORS,
useClass: ResponseInterceptor,
multi: true
}
],
bootstrap: [AppComponent]
})
export class AppModule { }
现在,当使用HttpClient
发送请求并且接收到200状态码的响应时,Angular将自动使用拦截器将路由导航到"/success"路径。