Угловой canActive с наблюдаемым

Я использую метод canActivate в охраннике. Внутри у меня есть наблюдаемое, которое возвращает мне объект. У этого объекта есть пароль. Я проверяю пароль, и если он правильный, я хочу, чтобы canActivate возвращал true, если нет, false.

Вот код

  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
    const uid = route.params.userId;
    const hackId = route.params.hackId;
    const token = this.authService.token;
    const queryParamsPassword = route.queryParams.password;
    this.hacksStorageService.fetchHack(token, uid, hackId)
      .subscribe(
        hack => {
          const hackPassword = hack[0].password;
          if (queryParamsPassword === hackPassword ) {
            return true
          } else {
            this.router.navigate(["/"]);
            return false
          }
        },
        error => {
          return false;
        }
      )
  }

Мне сложно понять ответ. Я должен дать ответ, когда это будет сделано. Как только я получу значение из подписки, я хочу вернуть логическое значение в canActivate.

Ошибка, которую я получаю, связана с методом canActivate (красным)

[ts]
Property 'canActivate' in type 'RoleGuard' is not assignable to the same property in base type 'CanActivate'.
  Type '(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) => void' is not assignable to type '(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) => boolean | Observable<boolean> | Pr...'.
    Type 'void' is not assignable to type 'boolean | Observable<boolean> | Promise<boolean>'.

Я думал, что возвращаюсь в каждую ветку if, так что этого должно быть достаточно, но, видимо, нет. Если я верну подписку, он тоже жалуется.

Любая помощь? Большое спасибо.


angular observable guard canactivate
person AlbertMunichMar    schedule 14.07.2018    source источник
comment
Нет, вы перенастраиваетесь в обратном вызове подписки, что не то же самое, что возврат из canActivate. Какую версию RXJS вы используете?   -  person user184994    schedule 14.07.2018

Ответы (1)


arrow_upward
2
arrow_downward

Ваш метод должен что-то возвращать. Он ничего не возвращает.

Он может возвращать логическое значение. Это возможно только в том случае, если вы знаете, какое значение нужно возвращать синхронно. Но вам нужен асинхронный вызов, чтобы знать, каким должен быть результат. Таким образом, вы не можете вернуть логическое значение. И поэтому охранник также может вернуть Observable<boolean>. Итак, сделайте это:

return this.hacksStorageService.fetchHack(token, uid, hackId).pipe(
  map(hack => {
    const hackPassword = hack[0].password;
    if (queryParamsPassword === hackPassword ) {
      return true;
    } else {
      this.router.navigate(["/"]);
      return false;
    }
  })
);
person JB Nizet    schedule 14.07.2018