Facing issue in routing in angular. how to make parametriased route with authentication.when we tried couple of things gives error. #964

Check the docs before asking a question: https://docs.abp.io/en/commercial/latest/ Check the samples, to see the basic tasks: https://docs.abp.io/en/commercial/latest/samples/index The exact solution to your question may have been answered before, please use the search on the homepage.

ABP Framework version: v3.0.4 UI type: Angular DB provider: EF Core Tiered (MVC) or Identity Server Seperated (Angular): no / yes Exception message and stack trace: Steps to reproduce the issue:

URL= 'http://localhost:4200/downloadexcel?requestId=62114d2c-8feb-4a60-8319-22bf7ec6da4d
d1be844b-d3a2-031a-f036-39f5d4380239'

downloadexcel -- angular module/component requestId --- parameter

Method 1:

{
    path: 'downloadexcel',
    component: ApplicationLayoutComponent,
    loadChildren: () => import('./downloadexcel/downloadexcel.module').then(m => m.DownloadexcelModule),
    canActivate: [AuthGuard, PermissionGuard],
     data: {
       routes: {
        name: '',
        iconClass: 'fa fa-line-chart',
        requiredPolicy: 'Litmus.Tenant.AnchorAdmin || Litmus.Tenant.SellerAdmin',
       order:1,
      } as ABP.Route,
     },
  },

-- In this case when user is authenticated it is working but if user is not authenticated then it go for authentication and after authentication gives below error:

core.js:4197 ERROR Error: Cannot match any routes. URL Segment: 'downloadexcel%3FrequestId%3D62114d2c-8feb-4a60-8319-22bf7ec6da4d'
    at ApplyRedirects.noMatchError (router.js:2270)
    at CatchSubscriber.selector (router.js:2254)
    at CatchSubscriber.error (catchError.js:29)
    at MapSubscriber._error (Subscriber.js:75)
    at MapSubscriber.error (Subscriber.js:55)
    at MapSubscriber._error (Subscriber.js:75)
    at MapSubscriber.error (Subscriber.js:55)
    at MapSubscriber._error (Subscriber.js:75)
    at MapSubscriber.error (Subscriber.js:55)
    at ThrowIfEmptySubscriber._error (Subscriber.js:75)

Method 2: URL== http://localhost:4200/downloadexcel/62114d2c-8feb-4a60-8319-22bf7ec6da4d

{
    path: 'downloadexcel/:requestId',
    component: ApplicationLayoutComponent,
    loadChildren: () => import('./downloadexcel/downloadexcel.module').then(m => m.DownloadexcelModule),
    canActivate: [AuthGuard, PermissionGuard],
     data: {
       routes: {
        name: '',
        iconClass: 'fa fa-line-chart',
        requiredPolicy: 'Litmus.Tenant.AnchorAdmin || Litmus.Tenant.SellerAdmin',
       order:1,
      } as ABP.Route,
     },
  },

In this case gives below error for if user is authenticated and not authenticated in both case gives below error :

core.js:4197 ERROR Error: Uncaught (in promise): RangeError: Maximum call stack size exceeded
RangeError: Maximum call stack size exceeded
    at RoutesService.find (abp-ng.core.js:777)
    at findRoute (abp-ng.core.js:969)
    at findRoute (abp-ng.core.js:972)
    at findRoute (abp-ng.core.js:972)
    at findRoute (abp-ng.core.js:972)
    at findRoute (abp-ng.core.js:972)
    at findRoute (abp-ng.core.js:972)
    at findRoute (abp-ng.core.js:972)
    at findRoute (abp-ng.core.js:972)
    at findRoute (abp-ng.core.js:972)
    at resolvePromise (zone-evergreen.js:798)
    at resolvePromise (zone-evergreen.js:750)
    at zone-evergreen.js:860
    at ZoneDelegate.invokeTask (zone-evergreen.js:399)
    at Object.onInvokeTask (core.js:27424)
    at ZoneDelegate.invokeTask (zone-evergreen.js:398)
    at Zone.runTask (zone-evergreen.js:167)
    at drainMicroTaskQueue (zone-evergreen.js:569)