Saat ini saya memperbarui aplikasi saya untuk menggunakan ner Router. Saya melakukan segalanya kecuali rute yang dilindungi.
Utama. ts terlihat seperti ini:
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 {AppComponent} from './app.component';
import {AuthGuard} from './services/auth.guard'
bootstrap(AppComponent, [appStateProvider, APP_ROUTER_PROVIDERS, AuthService, AuthGuard, HTTP_PROVIDERS,,disableDeprecatedForms(), provideForms()])
.catch(err => console.error(err));
Saya menerapkan auth.guard.ts:
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;
}
}
Dan di rute aplikasi saya punya:
export const routes: RouterConfig = [
{
path: '',
component: LoginComponent
},
{ path: 'login', component: LoginComponent },
{ path: 'home', component: HomeComponent, canActivate: ['AuthGuard']}
];
// Export routes
export const APP_ROUTER_PROVIDERS = [
provideRouter(routes)
];
Sebelum itu saya menggunakan perutean lama dan semuanya baik-baik saja. Sekarang, saya mendapat pesan 'Tidak ada penyedia untuk AuthGuard!' meskipun saya memasukkannya ke dalam penyedia bootstrap saya.
Di app.component.ts saya di dalam konstruktor, saya memiliki:
if (this._authService.isLoggedIn()) {
this._router.navigate(['/home']);
}
else {
this._router.navigate(['/login']);
}
Sebelum saya memperbarui router jika Pengguna tidak masuk, itu dialihkan ke halaman login, selain itu diarahkan ke halaman beranda dan pengguna tidak dapat melihat rumah sampai dia tidak masuk. Di mana saya salah, saya salah dan mengapa saya mendapatkan kesalahan ini sejak Saya menyertakan penyedia dalam metode bootstrap saya sebagai penyedia?
Terima kasih
1 menjawab
Hapus '
dari
canActivate: ['AuthGuard']},
Untuk
canActivate: [AuthGuard]},
Saya juga berpikir Anda harus menambahkan pathMatch: 'full'
ke
{
path: '',
component: LoginComponent,
pathMatch: 'full'
},
auth.guard.ts
Anda, saya dapat memperbaiki masalah yang saya alamicanActiate(...)
. Saya menambahkanActivatedRouteSnapshot
pada konstruktor, tetapi tampaknya itu cara yang salah, menambahkannya padacanActivate
sebagai argumen default berhasil.