2

在我的应用程序中，有多个链接具有相同的路由但具有不同的查询参数和片段。

例如，我有如下链接：

.../pages/golestan/npform?fid=26270#26270
.../pages/golestan/npform?fid=26280#26280
.../pages/golestan/npform?fid=26290#26290

当我在上述路线之一并通过不同的参数导航到同一路线时，路线没有改变，但通过改变 RouteReuseStrategy 这个问题得到了解决。现在我想调用 canDeactivate 来更改路线，当我导航到其他路线时调用了 canDeactivate 但是当我通过不同的 queryParams 和片段导航到同一路线时，不会调用 canDeactivate ！

const routes: Routes = [{
    ...
    {
      path: 'npform',
      component: NpFormComponent,
      canDeactivate: [
        NpFormGuard
      ],
    },
   ...
}];

@NgModule({
  declarations: [
    NpFormComponent
  ], 
  imports: [ ...
    RouterModule.forChild(routes)
  ],
  providers: [
    NpFormGuard
  ]
})
export class GolestanModule { }

@Injectable({providedIn: 'root'})
export class NpFormGuard implements CanDeactivate<KoFormComponent> {
  canDeactivate(
    component: NpFormComponent, 
    currentRoute: ActivatedRouteSnapshot,
    currentState: RouterStateSnapshot,
    nextState?: RouterStateSnapshot): Observable<boolean | UrlTree> | Promise<boolean | UrlTree> | boolean | UrlTree 
  {
    return !component.webBusy;
  }
}

import { Router } from '@angular/router';
constructor(private router: Router) {
    this.router.routeReuseStrategy.shouldReuseRoute = (future: ActivatedRouteSnapshot, current: ActivatedRouteSnapshot) => {
        const defaultReuse = (future.routeConfig === current.routeConfig);
        if(future.routeConfig&&future.routeConfig.path=='npform'&&
             (future.queryParams.fid||current.queryParams.fid)&&(future.queryParams.fid!=current.queryParams.fid))
            return false;
        return defaultReuse;
    
    };
}
4

1 回答 1

1

我的问题通过使用 RunGuardsAndResolvers 参数解决并将其设置为“始终”。此配置每次运行警卫。

const routes: Routes = [{
    ...
    {
      path: 'npform',
      component: NpFormComponent,
      runGuardsAndResolvers: 'always',
      canDeactivate: [
        NpFormGuard
      ],
    },
   ...
}];

见https://angular.io/api/router/RunGuardsAndResolvers

于 2021-07-05T14:09:14.473 回答