角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关键字。因为它期望一个没有实现的接口，所以你不能调用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'); 

它应该工作。