避免在Angular 2中導航的URL編碼

Question

如何避免URL Encoding與navigate？目前，我正在瀏覽如下的網址，它的編碼網址如/爲%2F。我想避免它，所以無論如何要做到這一點？

this.router.navigate(['/comp', { type: this.Type }]);

Answer 1

Angular2默認使用encodeURIComponent方法（）來編碼URL queryParams，您可以通過編寫自定義URL串並覆蓋默認功能避免它。

在我的情況下，我想避免Angular2避免用（％2）替換逗號（，）。我將Query傳遞給lang = en-us，en-uk將其轉換爲lang = en-us％2en-uk。

在這裏，我怎麼算出來：

CustomUrlSerializer.ts

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

export class CustomUrlSerializer implements UrlSerializer { 
    parse(url: any): UrlTree { 
     let dus = new DefaultUrlSerializer(); 
     return dus.parse(url); 
    } 

    serialize(tree: UrlTree): any { 
     let dus = new DefaultUrlSerializer(), 
      path = dus.serialize(tree); 
     // use your regex to replace as per your requirement. 
     return path.replace(/%2/g,','); 
    } 
} 

添加下面一行到你的主appModule.ts

import {UrlSerializer} from '@angular/router'; 
import {CustomUrlSerializer} from './CustomUrlSerializer'; 

@NgModule({ 
    providers: [{ provide: UrlSerializer, useClass: CustomUrlSerializer }] 
}) 

這不會破壞你的默認功能，並根據您的需要照顧網址。