August 30 2016
AngularJS - Slugify Filter
A custom AngularJS filter for converting a string into a url slug. A slug is a url & seo friendly string containing only lowercase alphanumeric characters and hyphens "-". Slugs are often used for including titles in URLs for SEO.
(function () {
'use strict';
angular
.module('app')
.filter('slugify', Filter);
function Filter() {
return function (input) {
if (!input)
return;
// make lower case and trim
var slug = input.toLowerCase().trim();
// replace invalid chars with spaces
slug = slug.replace(/[^a-z0-9\s-]/g, ' ');
// replace multiple spaces or hyphens with a single hyphen
slug = slug.replace(/[\s-]+/g, '-');
return slug;
};
}
})();
Example usage of AngularJS Slugify Filter
<a href="{{post._id}}/{{post.title | slugify}}">{{post.title}}</a>
Subscribe or Follow Me For Updates
Subscribe to my YouTube channel or follow me on Twitter or GitHub to be notified when I post new content.
- Subscribe on YouTube at https://www.youtube.com/channel/UCc46Wo9z8S3xSDhw9vdvxtg/
- Follow me on Twitter at https://twitter.com/jason_watmore
- Follow me on GitHub at https://github.com/cornflourblue
- Support me on Patreon at https://www.patreon.com/jasonwatmore