首页 文章

在角度2中，RouterOutlet似乎已经改变了@router的新库，有人知道该怎么做吗？

提问于
浏览 次
0

在角度2中，RouterOutlet似乎已经改变了@router的新库，有人知道该怎么做吗？

我正在使用带有打字稿的角度2 .

如果用户在尝试访问需要登录的页面时未登录，则下面的代码会将用户重定向到主视图 .

因为我've updated my library for @angular/router. it seems to stop working and the console doesnt give me a readable message but I' m假设 RouterOutlet 已经改变或 ComponentInstruction .

These are my angular2 dependencies:

@angular/common": "2.0.0-rc.1",
        "@angular/compiler": "2.0.0-rc.1",
        "@angular/core": "2.0.0-rc.1",
        "@angular/http": "2.0.0-rc.1",
        "@angular/platform-browser": "2.0.0-rc.1",
        "@angular/platform-browser-dynamic": "2.0.0-rc.1",
        "@angular/router": "2.0.0-rc.1",
        "@angular/router-deprecated": "2.0.0-rc.1",
        "@angular/upgrade": "2.0.0-rc.1",

I've added my code below:

从'@ angular2 / core'导入{Directive，Attribute，ElementRef，DynamicComponentLoader};从'@ angular2 / router'导入{Router，RouterOutlet，ComponentInstruction};

import {Environment} from './models/environment/environment';

@Directive({
  selector: 'router-outlet'
})

export class LoggedInRouterOutlet extends RouterOutlet {
  publicRoutes: any;
  private parentRouter: Router;
  environment: Environment;

  constructor(_elementRef: ElementRef, _loader: DynamicComponentLoader, _parentRouter: Router, @Attribute('name') nameAttr: string, _environment: Environment) {
    super(_elementRef, _loader, _parentRouter, nameAttr);

    this.parentRouter = _parentRouter;
    this.environment = _environment;

    this.publicRoutes = [
      'home',
      'contact',
      'forgotpassword',
      'socialRegister',
      'login',
      'register/',
      'register/:id',
      'blog/:slug',
      'blog',
      'sitemap',
      'newJobs',
      'newJob/:slug'
    ];
  }

  activate(instruction: ComponentInstruction) { 
     var ref = new Firebase(this.environment.firebaseUrl);

     var authToken = ref.getAuth();  
     var isPublicRoute = this.publicRoutes.indexOf(instruction.urlPath) > -1;
     var registerRouter = instruction.urlPath.substring(0, 8) === "register";
     var socialRegister = instruction.urlPath.substring(0, 14) === "socialRegister";
     var blogRouter = instruction.urlPath.substring(0, 4) === "blog";
     var newJobRouter = instruction.urlPath.substring(0, 6) === "newJob";

     if(authToken == null && !isPublicRoute && !registerRouter && !socialRegister && !blogRouter && !newJobRouter)
        this.parentRouter.navigate(['/Home']);

     return super.activate(instruction); 
  }

}
angularjs angular

1 回答

  • 1

    这是我到目前为止：

    my-app.component.ts

    import { Component } from '@angular/core';
import { MeComponent } from './+me';
import { Routes , Router, ROUTER_DIRECTIVES, ROUTER_PROVIDERS} from '@angular/router';
import { LoggedInRouterOutlet } from './utilities/loggedinoutlet.directive';
import { LoginComponent } from './+login';

@Component({
  moduleId: module.id,
  selector: 'my-app-app',
  templateUrl: 'my-app.component.html',
  styleUrls: ['my-app.component.css'],
  directives: [LoggedInRouterOutlet],
  providers: [ROUTER_PROVIDERS]
})
@Routes([
  {path: '/me', component: MeComponent},
  {path: '/login', component: LoginComponent}
])
export class MyAppAppComponent {

  constructor(private router: Router){};

  title = 'my-app works!';

}

    loggedinrouter.directive.ts

    import { Directive, Attribute, ResolvedReflectiveProvider, ViewContainerRef, ComponentRef, ComponentFactory } from '@angular/core';
import { Router, RouterOutletMap } from '@angular/router'
import { RouterOutlet } from '@angular/router/src/directives/router_outlet';

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

  constructor(routerOutletMap: RouterOutletMap, _location: ViewContainerRef, name: string) {
    super(routerOutletMap, _location, name);

    // The Boolean following each route below 
    // denotes whether the route requires authentication to view
    this.publicRoutes = {
      'login': true,
      'signup': true
    };
  }

  load(factory: ComponentFactory<any>, providers: ResolvedReflectiveProvider[], outletMap: RouterOutletMap) {
    // DO AUTH CHECK HERE

    return super.load(factory, providers, outletMap);
  }

}

    我遇到的问题是，因为name不是@Routes装饰器路径对象的可接受属性，所以我无法获得调用RouterOutlet的路径的路径或名称 .

    回复于

相关问题