Angular 2 - Umsetzung UrlSerializer

Question

Ich versuche, meine eigene UrlSerializer Klasse zu implementieren, ist es das, was ich getan habe:

import { UrlSerializer,UrlTree } from '@angular/router'; 

export class CustomUrlSerializer implements UrlSerializer { 

    parse(url: string): UrlTree { 
    // Change plus signs to encoded spaces 
    url.replace("%20", '-'); 
    // Use the default serializer that you can import to just do the 
    // default parsing now that you have fixed the url. 
    return super.parse(url) 
} 

    serialize(tree: UrlTree): string { 
    // Use the default serializer to create a url and replace any spaces with + signs 
    return super.serialize(tree).replace("%20", '-'); 
} 
} 

Wenn ich versuche ich folgende erros zu kompilieren:

c:/xampp/htdocs/proj/src/app/custom-url-serializer.ts (11,12): 'super' can only be referenced in a derived class. 
c:/xampp/htdocs/proj/src/app/custom-url-serializer.ts (16,12): 'super' can only be referenced in a derived class. 

Was ist los?

Answer 1

Ich würde sagen, das Problem ist das implements Schlüsselwort. Da es eine Schnittstelle erwartet, die keine Implementierung hat, können Sie super nicht aufrufen. Die UrlSerializer ist eine abstrakte Klasse, so dass Sie die DefaultUrlSerializer verwenden:

import { DefaultUrlSerializer, UrlTree } from '@angular/router'; 
class CustomUrlSerializer extends DefaultUrlSerializer { 
    parse(url: string) : UrlTree { 
     return super.parse(url); 
    } 
} 
new CustomUrlSerializer().parse('http://stackoverflow.com'); 

Es sollte funktionieren.