查看
請分享您的解決方案以擺脫此錯誤。提前感謝任何幫助！
uj5u.com熱心網友回復：
我現在看到你的問題。guard1 服務和guard2 服務有兩種不同的回傳型別。您需要Promise<boolean>根據 MasterGuard 服務代碼具有兩種回傳型別。
如果您在 MasterGuard 服務中看到 activateGuard() 那么它期待Promise<boolean>. 但是，在 guard1 服務中，您回傳了Observable<boolean>.
守衛1.service.ts：
@Injectable()
export class Guard1 implements CanActivate, CanActivateChild {
constructor(private router: Router) {}
canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Promise<boolean> {
console.log('Chain-1');
return Promise.resolve(true) // Modified this part
}
canActivateChild(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Promise<boolean> {
return this.canActivate(route, state);
}
}
守衛2.service.ts：
@Injectable()
export class Guard2 implements CanActivate, CanActivateChild {
constructor() {}
canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Promise<boolean> {
console.log('Chain-2');
return Promise.resolve(true);
}
canActivateChild(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Promise<boolean> {
return this.canActivate(route, state);
}
}
作業代碼：https : //stackblitz.com/edit/angular-route-guards-9tzxmv
問題是由于這一行：
switch (guardKey) {
case GUARDS.GUARD1:
guard = new Guard1(this._Router); // because of this line it was creating issue
break;
case GUARDS.GUARD2:
guard = new Guard2();
break;
default:
break;
}
uj5u.com熱心網友回復：
根據共享的stackblitz代碼，guard定義為：
let guard: Guard1 | Guard2;
所以防護件可以是所述型別的Guard1或Guard2，并且每個這些類的具有不同的canActivate方法回傳型別。一個有回傳型別Observable<boolean>，而另一個有Promise<boolean>.
該return guard.canActivate(this.route, this.state);陳述句可以回傳Observable<boolean>或Promise<boolean>，而包含 return 陳述句的函式被定義為 return Promise<boolean>。
你真的需要canActivate方法Guard1和Guard2類有不同的回傳型別嗎？如果您可以保持回傳型別一致，那么應該可以解決問題。
如果您的要求仍然是具有不同的回傳型別，那么如果將守衛分配給Guard2實體，則回傳陳述句應為：
return guard.canActivate(this.route, this.state).toPromise();
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/399258.html
標籤：有角的 打字稿 angular-ui-路由器
上一篇：Rxjs組合最新的可觀察值未定義