Angular template rendering non-encoded URL

Question

How do I render a URL which is not encoded. Below is a sample

import { Component } from '@angular/core';
import { Router } from '@angular/router';

@Component({
  selector: 'demo-app',
  template: `<a [routerLink]="stringURL">Click here</a>`,
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  stringURL:string;

  constructor(){
    this.stringURL = "/url;mode=3"
  }
}

The URL in the template has encoded string like /url%3Bmode%3D3 and I want it like /url;mode=3

How can I achieve this.

Here's the sample : https://stackblitz.com/edit/angular-q6mf3p

Thanks

Albondi · Accepted Answer · 2018-12-20 18:13:41Z

4

+25

You have to disable angular default URL encoding.

This post explains the solution quite well.

answered Dec 20, 2018 at 18:13

Albondi

1,1511 gold badge8 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Ashish Singh · Accepted Answer · 2018-12-22 07:57:19Z

2

If the link is static, you can use the directive as follows: link to user component

If you use dynamic values to generate the link, you can pass an array of path segments, followed by the params for each segment.

For instance ['/url',{mode: 3}] means that we want to generate a link to /url;mode=3.

you code will work see this new link click to see

import { Component } from '@angular/core';
import { Router } from '@angular/router';

@Component({
  selector: 'demo-app',
  template: `<a [routerLink]="stringURL">Click here</a>`,
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  stringURL:any;

  constructor(){
    this.stringURL = ["/url",{mode:3}]
  }
}

edited Dec 22, 2018 at 7:57

answered Dec 22, 2018 at 7:43

Ashish Singh

617 bronze badges

Collectives™ on Stack Overflow

Angular template rendering non-encoded URL

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related