2

私はRouterOutletを拡張し、アプリ全体の認証およびルート保護を作成するには、このようなコードを使用していますLoggedInOutlet角度2認証 - ルータ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を使用して廃止されました。 Angular2の現在のRC4バージョンでは、このクラスはreouter-deprecatedの下にリストされています。 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-activateguardもご覧ください。 –