현재 라우터에 ner를 사용하도록 내 앱이 업데이트되었습니다. 나는 보호 된 경로를 제외한 모든 것을했다.각도 2 RC4 라우터 제공 업체
주.
import { Injectable } from '@angular/core';
import { CanActivate, Router, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
import { AuthService } from './auth.service';
import {Observable} from 'rxjs/Observable';
@Injectable()
export class AuthGuard implements CanActivate {
constructor(private _authService: AuthService, protected _router: Router) {}
canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> | boolean {
if (state.url !== '/login' && !this._authService.isLoggedIn()) {
this._router.navigate(['/login']);
return false;
}
return true;
}
}
및 응용 프로그램 경로에
내가 가진 : 나는 오래된 라우팅 및 미세 모두를 사용하는 전export const routes: RouterConfig = [
{
path: '',
component: LoginComponent
},
{ path: 'login', component: LoginComponent },
{ path: 'home', component: HomeComponent, canActivate: ['AuthGuard']},
{ path: 'charts', component: ChartsComponent},
{ path: 'performance', component: PerformanceComponent},
{ path: 'news', component: NewsComponent},
{ path: 'transactions', component: TransactionsComponent},
{ path: 'portfolio', component: PortfolioComponent},
{ path: 'crossRates', component: CrossRatesComponent},
{ path: 'report', component: ReportComponent},
{ path: 'security', component: SecurityPricesComponent},
];
// Export routes
export const APP_ROUTER_PROVIDERS = [
provideRouter(routes)
];
내가 auth.guard.ts을 implementeed
import {bootstrap} from '@angular/platform-browser-dynamic';
import {disableDeprecatedForms, provideForms} from '@angular/forms';
import {HTTP_PROVIDERS} from '@angular/http';
import 'rxjs/Rx';
import {AuthService} from './services/auth.service';
import {InsaService } from './services/insa.service';
import {AppComponent} from './app.component';
import {appStateProvider} from './providers/AppStateProvider'
// Import configured routes
import { APP_ROUTER_PROVIDERS } from './app.routes';
import {AuthGuard} from './services/auth.guard'
bootstrap(AppComponent, [appStateProvider, APP_ROUTER_PROVIDERS, AuthService, AuthGuard, HTTP_PROVIDERS, InsaService ,disableDeprecatedForms(), provideForms()])
.catch(err => console.error(err));
: TS는 다음과 같습니다 . 이제 AuthGuard에 대한 공급자가 없습니다. 내가 부트 스트랩 공급자에 포함 시켰습니다. 생성자 안에 내 app.component.ts에서
내가 가진 :
사용자가 그 안에 기록되어 있지 않은 경우 나 라우터를 업데이트하기 전에if (this._authService.isLoggedIn()) {
this._router.navigate(['/home']);
}
else {
this._router.navigate(['/login']);
}
은 로그인 페이지로 리디렉션, 다른 사람이 홈 페이지 및 사용자 나오지 않았어로 리디렉션 ' 그가 로그인하지 않을 때까지 집에 돌아 가지 않아야합니다. 내가 틀렸고 공급자로서 내 부트 스트랩 방법에 공급자를 포함 시켰기 때문에 왜이 오류가 발생합니까?
감사
처음에
pathMatch: 'full'
을 추가해야한다고 생각 , 그 질문은 실제로 내 질문에 대한 답변입니다. 'auth.guard.ts' 코드 덕택에'canActiate (...) '문제를 해결할 수있었습니다. 나는 생성자에'ActivatedRouteSnapshot'을 추가하고 있었지만, 잘못된 방법으로, canActivate에 기본 인자로 추가했습니다. –