Encode AngularJS expression [duplicate]

Question

Introduction :

I have a expression

{{ track.title }}

it contains one word or more than one word. i.e xyz or xyz abc

This track.title is then used in a URL.

http://www.example.com/{{ track.title }}

Problem :

this url is working fine with one word in track.title but it will break with more than one words.

So, I want to know is there any way to encode the url so that it will not break while sharing.

Any immediate help will be highly appreciable. Thanks

personally I prefer to create a slug that removes whitespace and non url compliant characters and replace with - or _. Makes it more human readable — charlietfl
– charlietfl, Commented Sep 30, 2015 at 17:50
@charlietfl I would do the same, using a slug is the nicest way to go. — severin.julien
– severin.julien, Commented Sep 30, 2015 at 17:56

Deimyts · Accepted Answer · 2015-09-30 17:52:58Z

0

You need to escape the spaces in your title somehow.

For readability, instead of using something like xyz%20abc, you might replace them with hyphens or underscores instead. xyz-abc or xyz_abc

Since you still want the title displayed on the page to be unescaped, you may want to create a new variable to hold the escaped version.

track.url = track.title.replace(' ', '-');

answered Sep 30, 2015 at 17:52

Deimyts

3742 gold badges3 silver badges13 bronze badges

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

3 Comments

charlietfl Over a year ago

that's not enough sanitizing for a url and will only replace first instance

Deimyts Over a year ago

I was thinking that you could apply the replace when you pull in the data - for each track object, add the url property generated by sanitizing the title. I could probably have clarified that better in my answer. As for hyphens not being enough sanitizing, why is this? What would be a better sanitization scheme?

charlietfl Over a year ago

just meant there are other non compliant url characters also and replace isn't global without a modifier

Collectives™ on Stack Overflow

Encode AngularJS expression [duplicate]

1 Answer 1

3 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Linked

Related