How can I set the permissions base on URL parameters?

[winsonet]

I'm submitting a...

[ ] Regression (a behavior that used to work and stopped working in a new release)
[ ] Bug report  
[ ] Feature request
[x] Documentation issue or request

Current behavior

Can't check the permissions base on difference URL parameters

Expected behavior

For example, there are below URL with difference parameters

1. http://www.abc.com/grade/p1
2. http://www.abc.com/grade/p2
3. http://www.abc.com/grade/p3

and I set the router code as below

{
  path: 'grade/:gradeType', component: UserGradeComponent,
  canActivate: [NgxPermissionsGuard],
  data: {
    permissions: {
      only: ['p1','p2'],
      redirectTo: '/403',
    },
  }
}

can I set the p1 grade user only can access URL with p1 and the p2 user only can access the URL with p2 and so on...?

Thanks!

Environment

Angular version: 15.0.4
ngx-permissions version: 14.0.0

[AlexKhymenko]

Hi did You try something ike this ?

permissions: {
               only: ['p1','p2'],
               redirectTo: {
                 p1: '/route/p1',
                 p2: '/route/p2',
                 default: 'login'
               }
        }

If this doesnt work its possible to create customGuard and use ngxPermissionsGuard in the constructor of your guard to just check permissions.

[winsonet]

thanks for your reply, but unfortunately, it will be dead looping and redirect to the page with this setting and let the browser hang, can you show me some simple how to create customGuard and use ngxPermissionsGuard ?

many thanks!

[AlexKhymenko]

The main idea is this one
If You want to see video https://www.youtube.com/watch?v=d92LXFfdrJc&list=PLHw3vRAUIqUOLqBpoR-eYvZxiPGPh18y5&index=8&t=1s

and this is code for easier understanding

@Injectable({
  providedIn: 'root'
})
export class CustomGuard implements CanActivate {
  constructor(private ngxPermissionsGuard: NgxPermissionsGuard,
              private router: Router) {
  }
  canActivate(
    route: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): Observable<boolean | UrlTree> | Promise<boolean | UrlTree> | boolean | UrlTree {
    const alwaysData = route.data['permissions'].always
    const notFoundData = route.data['permissions'].notFound

    const alwaysRequestData: any = {
      ...route,
      data: {
        permissions: {
          only: alwaysData
        }
      }
    }

    const notFoundRequestData: any = {
      ...route,
      data: {
        permissions: {
          only: notFoundData
        }
      }
    }

    const alwaysGuard = this.ngxPermissionsGuard.canActivate(alwaysRequestData, state) as Promise<boolean>
    const notFoundGuard = this.ngxPermissionsGuard.canActivate(notFoundRequestData, state) as Promise<boolean>


    return alwaysGuard.then((data) => {
      if (!data) {
        this.router.navigate(['denied'])
        return Promise.reject();
      }

      return notFoundGuard
    }).then((data) => {

      if (!data) {
        this.router.navigate(['not-found'])
      }
      return data;
    });
  }

}

[winsonet]

I will try and study it, many thanks!

[winsonet]

I have solved the problem, thanks!