我正在使用angular-cli RC0搭建Angular 2應用程序。 我已經設置了一個AuthGuard來保護一些路線。這名警衛實施了CanActivate,如果沒有登錄,則將用戶重定向到登錄頁面,並且一個Angular Material2 MdSbackBar應該顯示一條自定義消息。 這裏AuthGuard:Angular 2:TypeError:不是函數
@Injectable()
export class AuthGuard implements CanActivate {
constructor(
private router: Router,
private authService: AuthService,
private growlerService: GrowlerService
) { }
canActivate(): boolean {
if (this.authService.isAuthenticated()) {
return true;
} else {
this.router.navigate(['auth/login']);
this.growlerService.growl('Autenticazione richiesta', GrowlerMessageType.Error);
return false;
}
}
}
在這裏,如上所示,其被稱爲在CanActivate方法咆哮服務:
@Injectable()
export class GrowlerService {
constructor() { }
growl: (message: string, type: GrowlerMessageType) => void;
}
最後在咆哮部件的實際功能
export class GrowlerComponent {
constructor(
private snackBar: MdSnackBar,
private growlerService: GrowlerService
) {
growlerService.growl = this.growl.bind(this);
}
growl(message: string, type: GrowlerMessageType): void {
const growlerConfig = new MdSnackBarConfig();
growlerConfig.duration = 3000;
growlerConfig.extraClasses = this.growlerTypeClass(type);
this.snackBar.open(message, null, growlerConfig);
}
}
當CanActivate未被調用時,所有內容都正確地導入/導出,並且咆哮者可以正常工作。爲了構建這個,我遵循this example,在示例中用一個角度材料組件替換了增量器組件。 GrowlerTypeClass是在擴展器組件中定義的私有方法,但這不是問題。 問題是,當未登錄的用戶和canActivate嘗試調用咆哮服務,我得到以下錯誤控制檯:提前
EXCEPTION: Uncaught (in promise): TypeError: this.growlerService.growl is not a function
TypeError: this.growlerService.growl is not a function
at AuthGuard.webpackJsonp.259.AuthGuard.canActivate
感謝您幫助。
你可以添加Auth Guard的構造函數嗎? – echonax
@echonax我已經編輯了片段。對不起,我的英語很糟糕:( – bado