„Kein Anbieter für AuthGuard!“ Mit CanActivate in Angular 2

EDIT: Offensichtlich ist dies veraltet, jetzt bieten Sie Ihre Wache an derproviders Array in einem NgModule. Weitere Informationen finden Sie in anderen Antworten oder in der offiziellen Dokumentation.

Bootstrapping für eine Komponente ist veraltetprovideRouter() ist auch veraltet

Ich versuche, die Authentifizierung in meinem Projekt mit einem Login und AuthGuard aus dem Angular2-Handbuch einzurichten:https: //angular.io/docs/ts/latest/guide/router.htm

Ich verwende die Version: "@ angle / router": "3.0.0-beta.1".

Ich werde versuchen, so viel wie möglich zu erklären. Bitte teilen Sie mir mit, ob Sie weitere Informationen benötigen.

Ich habe meine main.ts -Datei, die die App mit dem folgenden Code aktualisiert:

bootstrap(MasterComponent, [
    APP_ROUTER_PROVIDERS,
    MenuService
])
.catch(err => console.error(err));

Ich lade die MasterComponent, die einen Header mit Schaltflächen lädt, mit denen ich durch meine App navigieren kann, und der vorerst auch meinen Hauptbildschirm enthält.

Ich folge der Anleitung, damit meine App auf die gleiche Weise funktioniert. app.routes.ts :

export const routes: RouterConfig = [
    ...LoginRoutes,
    ...MasterRoutes
];

export const APP_ROUTER_PROVIDERS = [
    provideRouter(routes),
    AUTH_PROVIDERS
];

Und die login.routes.ts aus der Anleitung, die meinen AuthGuard definiert:

export const LoginRoutes = [
    { path: 'login', component: LoginComponent }
];

export const AUTH_PROVIDERS = [AuthGuard, AuthService];

ie @my Master-Komponente verfügt über eine eigene Routendefinition, die auch den Guard enthält, den ich einrichten möchte. master.routes.ts :

export const MasterRoutes : RouterConfig = [
    { path: '', redirectTo: '/accueil', pathMatch: 'full' },

    {
        path: 'accueil',
        component: AccueilComponent
    },

    { path: 'dashboard', component: DashboardComponent, canActivate: [AuthGuard] },
];

Und ich verwende die gleichen Dateien wie die Anleitung, die auth.guard.ts, auth.service.ts, login.component.ts und login.routes.ts.

In meinem header.component.ts -Datei, wenn ich versuche, auf Routen zuzugreifen, funktioniert es einwandfrei, aber wenn ich versuche, auf den geschützten Pfad (/ dashboard) zuzugreifen, erhalte ich dasKein Provider für AuthGuard! Error

Ich habe den letzten Beitrag mit dem gleichen Problem wie ich gesehen NoProviderError mit CanActivate in Angular 2), aber für mich ist die Wache bis zum @ korrekt geboot main.ts -Datei, damit mein Router weiß, welche Routen mit dem AuthGuard bereitgestellt werden sollen, oder?

Jede Hilfe oder Beratung wäre sehr dankbar. Vielen Dank

Antworten auf die Frage(22)

Ihre Antwort auf die Frage