How do I extend RouterOutlet when using the new router in RC.1

问题

I can't seem to extend RouterOutlet when using the new router in RC.1

Example:

import { Directive } from '@angular/core';
import { Router, ROUTER_DIRECTIVES, RouterOutlet } from '@angular/router';


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

export class RouterOutletDirective extends RouterOutlet {

}

The error:

@angular/router/index"' has no exported member 'RouterOutlet'.

Am i doing something wrong or is this broke with the new router in RC.1?

Updated:

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


@Directive({
  selector: 'router-outlet'
})
export class RouterOutletDirective extends RouterOutlet {

  constructor(parentOutletMap: RouterOutletMap, _location: ViewContainerRef, name: string) {
    super(parentOutletMap, _location, name);
    console.log( parentOutletMap );
  }


  activate() {
    console.log('Activate');
  }
}

So it's now running but the RouterOutlet is underlined in red with type "any" is not a constructor function type and also the activate part doesn't work. Am i missing something?

回答1:

RouterOutlet and RouterLink are not exported from @angular/router. This was fixed already recently and I'd expect this fix to be included in RC.2.

You can import them from the private path (src/...) as a workaround until the new version is published.

Hint

That said, there is again a new router work in progress. If you currently working on migrating from the beta router or @angular/router-derprecated to @angular/router it's probably better to postpone until the new new router is out.

回答2:

Here is working code with version RC 1

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

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

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

    }
    //activate() {} //EXPIRED
    unload(): void { }
    loadedComponent: Object
    isLoaded: boolean
    load(factory, providers, outletMap: RouterOutletMap): any {
        super.load(factory, providers, outletMap);
        //DO YOUR CHECK HERE
        return this.loadedComponent;
    }
}

来源：https://stackoverflow.com/questions/37645771/how-do-i-extend-routeroutlet-when-using-the-new-router-in-rc-1

标签

angular

angular2-routing

angular2-directives