在Angular中，当我们使用RouteReuseStrategy来在页面上重复使用一个组件时，有时候会遇到一些返回时的问题，尤其是在进行跨模块的页面跳转时会更加明显。在这种情况下，我们可以通过以下方法来解决这个问题：

1.在应用的module.ts文件中，定义RouteReuseStrategy。

import { NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; import { RouteReuseStrategy } from '@angular/router';

import { AppComponent } from './app.component'; import { AppRoutingCache } from './app-routing.cache';

@NgModule({ declarations: [AppComponent], imports: [BrowserModule], providers: [ { // 注入自定义 RouteReuseStrategy provide: RouteReuseStrategy, useClass: AppRoutingCache, }, ], bootstrap: [AppComponent], }) export class AppModule {}

2.定义一个自定义的RouteReuseStrategy类，并继承默认的RouteReuseStrategy。

import { ActivatedRouteSnapshot, DetachedRouteHandle, RouteReuseStrategy, } from '@angular/router';

export class AppRoutingCache implements RouteReuseStrategy { private handlers: { [key: string]: DetachedRouteHandle } = {};

shouldDetach(route: ActivatedRouteSnapshot): boolean { return true; }

store( route: ActivatedRouteSnapshot, handle: DetachedRouteHandle ): void { this.handlers[route.url.join('/')] = handle; }

shouldAttach(route: ActivatedRouteSnapshot): boolean { return !!this.handlers[route.url.join('/')]; }

retrieve(route: ActivatedRouteSnapshot): DetachedRouteHandle { if (!route.routeConfig) { return null; } return this.handlers[route.url.join('/')]; }

shouldReuseRoute( future: ActivatedRouteSnapshot, curr: ActivatedRouteSnapshot ): boolean { return future.routeConfig === curr.routeConfig; } }

在自定义的RouteReuseStrategy中，我们实现了shouldDetach(), store(), shouldAttach(), retrieve()和shouldReuseRoute()方法。

我们通过shouldDetach()方法允许我们缓存所有页面，store