Encode AngularJS expression

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, Sep 30 '15 at 17:50
@charlietfl I would do the same, using a slug is the nicest way to go. — severin.julien, Sep 30 '15 at 17:56

score 0 · Accepted Answer · answered Sep 30 '15 at 17:52

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 '15 at 17:52

Deimyts

that's not enough sanitizing for a url and will only replace first instance – charlietfl Sep 30 '15 at 17:54
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? – Deimyts Oct 01 '15 at 16:36
just meant there are other non compliant url characters also and `replace` isn't global without a modifier – charlietfl Oct 01 '15 at 16:55

1 Answers1