Angular 2+: доступ к маршруту в параметрах транзитного запроса, а не к текущему активному маршруту

Question

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

ActivatedRoute показывает только текущий статус маршрута, в котором они находятся, а не тот, который находится в пути. Поэтому, если я нахожусь на странице "app / users / list", снимок маршрута будет "app / users / list", когда информация извлекается для защиты canActivationChild, но я пытаюсь получить доступ к ссылке, на которую они идут, а не туда, где они приходят из. (это то, что Angular должен делать; это текущий активный снимок)

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

Сценарий: у меня есть таблица со списком пользователей, и каждый пользователь может перейти на панель мониторинга или на экран редактора для завершения, прежде чем войти на панель мониторинга. Поэтому, когда пользователь нажимает на пользователя из таблицы списка пользователей, средство защиты маршрута должно проверить, имеют ли пользователь определенные свойства, не равные NULL, прежде чем перейти к панели управления, и если у них есть какие-либо свойства NULL, они направляются защитником. на страницу редактора. Страница панели мониторинга защищена средством canActivationChild, которое решает, могут ли данные пользователя отображаться на этой панели, основываясь на том, имеется ли у них вся доступная информация, и если нет, то перенаправляются в редактор для завершения.

 // The Link
 this.router.navigate(['/dashboard', { id: userId }])


 // The Guard
 @Injectable()
 export class CanShowUserDashboard implements CanActivateChild {

   constructor(
     private _router: Router,
     private _route: ActivatedRoute
   ) {}

   canActivateChild() {
    this._route.queryParams.subscribe((next) => {
       let queryParams = next.id;
       // queryParams is undefined
    })
   }
  }

Цель Получение параметров запроса по ссылке на панели мониторинга, а не на странице списка текущего активного пользователя.

Единственное решение, которое я получил? Думал о том, чтобы передать пользователя в службу, и чтобы охранник получил доступ к службе, чтобы получить информацию.

Answer 1

canActivateChild функция получает ActivatedRouteSnapshot дочернего маршрута в качестве первого параметра.

export interface CanActivateChild {
    canActivateChild(childRoute: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean;
}

Таким образом, вы можете получить идентификатор пользователя из childRoute аргумент.

@Injectable()
export class CanShowUserDashboard implements CanActivateChild {

    canActivateChild(childRoute: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {
         // prints the value of userId
         console.log(childRoute.queryParams['id']);
    }
}

Answer 2

Это может случиться с вами, потому что вы пытались перейти к дочернему маршруту, не сохраняя фактический параметр sain следующим образом this.router.navigate(['child-one', {id:'childparameter'}],{ relativeTo: this.route });или из шаблона гиперссылка, как <a [routerLink]="['child']" [queryParams]="{ id: childparam}" > link-to-child </a> в обоих случаях браузер уничтожит родительскую строку запроса, даже если вызов маршрута относительно фактического маршрута, чтобы предотвратить его использование:

Для первого случая: this.router.navigate(['/parent' , { id: this.router.routerState.snapshot._root.children[0].value.url[0].parameters['id'] } ,'child' , {id:this.route.snapshot.queryParams['id']} ]);, он сохраняет самый первый параметр в некотором триоде объекта router.routerState.snapshot._root, соответствующий происхождению системы маршрутизации, до последнего определяющего параметра.

Для второго случая: <a [routerLink]="[{id:oldparam},'child']" [queryParams]="{ id: childparam }" > link-to-child </a> или же <a [routerLink]="['.', {id:oldparam},'child']" [queryParams]="{ id: childparam }" > link-to-child </a>, где oldparam переменная области видимости, пойманная в фазе перехода между маршрутами, как упомянуто в первом случае.

Обратите внимание, что я использовал _root.children[0] произвольно, вы можете использовать _root.value.firstChild также, это будет иметь тот же результат.

см. мою скрипку здесь

Вы не должны понимать все это, просто посмотрите на функцию CanActivateChild() который имеет this.route.queryParams.subcribe часть.

decide(a,b){

   if(a.children[0]!==undefined){
      console.log('haschild');
      return a.value.url[0].parameters['id'];}
    else
    {
      console.log('dosnt have child');
      return b;
    }
  }

CanActivateChild () {

    console.log("decide");

    this.route.params.subscribe((next) => {
       console.log("logging parent")
       console.log( this.decide(this.router.routerState.snapshot._root.children[0],next.id));
    });
  }

Эта функция регистрирует параметры транзитивного запроса, если вызов маршрута вложенный, или последний указанный параметр, если адрес бездетен. Который может быть указан decide() функция.