web-dev-qa-db-ja.com

angular 2 URLエンコードを無効にする

URLエンコードを無効にしたいと思います。

これを以下で使用するとき。

this.router.navigate(['/profile', { tags: 'one,two' }]);

URLはこんな感じ

http://localhost:4200/profile;tags=one%2Ctwo

以下のようになりたい

http://localhost:4200/profile;tags=one,two

URLエンコードを無効にする方法はありますか？

javascripthttpangularangular2-routing
14
Jason

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 }]
})

これにより、デフォルトの機能が損なわれることはなく、必要に応じてURLが処理されます。

30
jigar gala