Encode string for URL (angular)

angular url encode
user749798 picture user749798 · Mar 29, 2019 · Viewed 51.2k times · Source

I'm trying to encode a string that's pretty complex, so that I can include it in a mailto:

Component:

<a href="mailto:[email protected]?subject='Hello'&{{body}}">

TS: 

import { HttpParameterCodec } from "@angular/common/http";

let body = encodeValue('This is the example body\nIt has line breaks and bullets\n\u2022bullet one\n\u2022bullet two\n\u2022bullet three')

When I try to use encodeValue, I get "cannot find name encodeValue.

How would be best to url-encode body?

Answer

nircraft picture nircraft · Mar 29, 2019

HttpParameterCodec : is a codec for encoding and decoding parameters in URLs( Used by HttpParams).

If you need to encode Url you can use the below:

encodeURI assumes that the input is a complete URI that might have some characters which need encoding in it.

encodeURIComponent will encode everything with special meaning, so you use it for components of URIs, such as:

var textSample= "A sentence with symbols & characters that have special meaning?";
var uri = 'http://example.com/foo?hello=' + encodeURIComponent(textSample);

Related questions

How to navigate to other page in angular 6?

Im trying to redirect my page from login to another page. Im following this code. My login component ts file: import { Router } from '@angular/router'; constructor(private router: Router) { } funLogin(mobilenumber){ this.router.navigateByUrl('registration'); } In my html Im …

Read More
Get current route without parameters

I need to get my current route without params in Angular 2, I found a way to get the current route with params as follows: this.router.url and then split it: this.router.url.split(';')[0] But this looks …

Read More
How to create a url string with query parameters from an object in Angular 5+?

I am trying to create a URL from an object in an Angular 5 SPA. My code looks like the following: import { UrlTree, UrlSegmentGroup, DefaultUrlSerializer, UrlSegment } from "@angular/router"; const urlTree = new UrlTree(); urlTree.root = new UrlSegmentGroup([new UrlSegment("EndPoint", {})], {}); urlTree.…

Read More