2

Я использую такой код, чтобы расширить RouterOutlet и создать приложение широкие аутентификации и защиту маршрутаLoggedInOutlet angular2 authentication - Router v3.0.0-alpha8 - Где ComponentInstruction?

import {Directive, Attribute, ViewContainerRef, DynamicComponentLoader} from '@angular/core'; 
import {Router, ComponentInstruction} from '@angular/router'; 
import {Router} from '@angular/router'; 
import {RouterOutletMap} from '@angular/router/src/router_outlet_map'; 
import {RouterOutlet} from '@angular/router/src/directives/router_outlet'; 

import {Authentication} from '../common/authentication.service'; 

@Directive({ 
    selector: 'router-outlet' 
}) 
export class LoggedInRouterOutlet extends RouterOutlet { 
    publicRoutes:any; 
    isAuthenticated:boolean; 
    //private router: any; 

    constructor(public _elementRef: ElementRef, public _loader: DynamicComponentLoader, 
       public _parentRouter: Router, @Attribute('name') nameAttr: string, public authService:Authentication) { 
    super(_elementRef, _loader, _parentRouter, nameAttr); 
    this.isAuthenticated = authService.isLoggedIn(); 


    //this.router = _parentRouter; 
    /** 
    * DEFINE PUBLIC ROUTES 
    * 
    * The Boolean following each route below denotes whether the route requires authentication to view. 
    * 
    * Format: key/value pair 
    * - key is the /route url "/login", "/signup", etc 
    * - value is a boolean true/false 
    * `true` means it's a publicly available route. No authentication required 
    * `false` means it's a protected route which is hidden until user is authenticated 
    * 
    */ 
    this.publicRoutes = { 
     'login': true, 
     'signup': true, 
     '404': true 
    }; 
    } // end constructor 

    routeIsActive(routePath:string) { 
    return this.router.url == routePath; 
    } 

    activate(instruction: ComponentInstruction) { 
    // let url = instruction.urlPath; 
    let url = this.router.url; 
    // If the url doesn't match publicRoutes and they are not authenticated... 
    if (!this.publicRoutes[url] && !this.isAuthenticated) { 
     // todo: redirect to Login, may be there a better way? 
     this.router.navigateByUrl('/login'); 
    } 
    return super.activate(instruction); 
    } 
} 

Проблема заключается в том, что ComponentInstruction не существует в новом v3.0.0-alpha8 маршрутизатора, и супер метод подпись изменилась , Как обновить это для работы на новом маршрутизаторе? Я не могу найти документацию, объясняющую изменения.

ответ

3

ComponentInstruction устарела. В текущей версии RC4 версии Angular2 этот класс включен в список, не рекомендованный для повторного использования. При входе RC5 этот пакет будет удален.

RouterOutlet сильно изменился с течением времени и чтобы ваш класс LoggedInRouterOultet работал, вы должны использовать интерфейс CanActivate.

Вы можете сделать что-то вроде этого:

ли инъекционный сервис как LoggedInActivator показано здесь:

import { Injectable } from '@angular/core'; 
import { Router, CanActivate } from '@angular/router'; 
import { LogInService } from './login.service'; 

@Injectable() 
export class LoggedInActivator implements CanActivate { 
    constructor(private loginService: LogInService) {} 

    canActivate() { 
    return this.loginService.isLoggedIn(); 
    } 
} 

Добавить canActivate и сопоставьте его LoggedInActivator на компонент при определении маршрута:

{ path: 'home', component: HomeComponent, canActivate: [LoggedInActivator] } 

Надеюсь, это поможет!

+1

См. Также https://angular.io/docs/ts/latest/guide/router.html#!#can-activate-guard –