Angular 2 - 实现 UrlSerializer

Question

我正在尝试实现我自己的 UrlSerializer 类，这就是我所做的:

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", '-');
    }
}

当我尝试编译时，出现以下错误:

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.

出了什么问题？

Answer 1

我想说问题出在 implements 关键字上。因为它需要一个没有实现的接口(interface)，所以你不能调用super。 UrlSerializer 是一个抽象类，因此您可以使用 DefaultUrlSerializer:

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

应该可以。