Как перенаправить на детский маршрут от охранника в угловых - PullRequest
Новая
       22

Как перенаправить на детский маршрут от охранника в угловых

0 голосов
/ 26 сентября 2018

Как перенаправить на дочерний маршрут от защитника родительского маршрута, а также защитить дочерние маршруты от прямого доступа *?

Проблема с абсолютной навигацией защита родительского компонентавызывается снова в цикле при переходе к дочернему маршруту.

Проблема с относительной навигацией заключается в том, что охрана защищает родительский маршрут, поэтому нет активированного маршрута для навигации относительно.Также это, вероятно, не защитит дочерние маршруты.Возможно, тот же самый охранник может также использоваться с дочерними маршрутами или с CanActivateChildren.

Stackblitz Пример: https://stackblitz.com/edit/angular-qbe2a7

маршруты 

const appRoutes: Routes = [
  {
    path: 'foo',
    component: FooComponent,
    canActivate: [ RedirectionGuard ],
    children: [
      {
        path: 'foo-child',
        component: FooChildComponent
      }
    ]
  }
];

canActivate () в страже 

canActivate(
    route: ActivatedRouteSnapshot,
    state: RouterStateSnapshot
  ): Observable<boolean>|Promise<boolean>|boolean {

    console.log('guard: ', route, state, this.route);

    // idea: create own ActivatedRoute and give it the values from ActivatedRouteSnapshot which knows about 'foo/'
    const foo: ActivatedRoute = new ActivatedRoute();
    console.log(foo);

    // Error: Cannot match any routes
    // I think because there is no route to be relative to when canActivat is called. Router has not yet navigated to '/foo/'
    this.router.navigate(['../foo-child'], {               relativeTo: this.route
    });

    // Errors with infinite loop because '/foo/' has this guard which will then be called again
    //this.router.navigate(['/foo/foo-child']);

    // navigate returns true also. maybe just return that.
    return true;
  }

* Почему бы не добавить охрану всем детям, которых вы спросите.Мне нужно перенаправить с родительского маршрута на множество разных дочерних маршрутов в зависимости от состояния приложения.В настоящее время я использую один из дочерних маршрутов для перенаправления из этого компонента, но он не защищает дочерние маршруты от прямой навигации пользователем.

1 Ответ

0 голосов
/ 26 сентября 2018

Одним из способов достижения этого может быть использование URL-параметров, использование canActivateChild и перенаправление на дочерний маршрут при входе в родительский маршрут.

StackBlitz Пример: https://stackblitz.com/edit/angular-redirect-with-params

маршрутизация

const appRoutes: Routes = [
  {
    path: 'foo',
    component: FooComponent,
    canActivateChild: [ RedirectionGuard ],
    children: [
      {
        path: '',
        pathMatch: 'full',
        redirectTo: 'foo-child-1'
      },
      {
        path: 'foo-child-1',
        component: FooChildComponent
      },
       {
        path: 'foo-child-2',
        component: FooChildComponent
      }
    ]
  },
];

охранник 

canActivate(
    route: ActivatedRouteSnapshot,
    state: RouterStateSnapshot
  ): Observable<boolean>|Promise<boolean>|boolean {

    console.log('params:', route.params, route.url);
    if (!route.params.skip) {
      this.router.navigate(['/foo/foo-child-2', { skip: true }], {
        queryParams: { skip: 1 }
      });
    }

    return true;

  }

  canActivateChild(
    route: ActivatedRouteSnapshot,
    state: RouterStateSnapshot
  ) {
    return this.canActivate(route, state);
  }
...