Angular filter to replace all underscores to spaces

Question

I need a filter to replace all the underscores to spaces in a string

Solution 1

string.replace not only accepts string as first argument but also it accepts regex as first argument. So put _ within regex delimiters / and aslo add g modifier along with that. g called global modifier which will do the replacement globally.

App.filter('underscoreless', function () {
  return function (input) {
      return input.replace(/_/g, ' ');
  };
});

Solution 2

Here's a generic replace filter alternative

App.filter('strReplace', function () {
  return function (input, from, to) {
    input = input || '';
    from = from || '';
    to = to || '';
    return input.replace(new RegExp(from, 'g'), to);
  };
});

Use it as follows in your HTML:

{{ addText | strReplace:'_':' ' }}

Minor note: Any HTML tags in the to parameter will cause the expression to fail due to Angular content security rules.

Solution 3

In some case, you can use split() function.
.replace function is not compliant with regexp syntax (i.e. .replace(/,/g,'\n') syntax)

Full syntax:
{{myVar.toString().split(',').join('\n')}}

.toString() function is in case myVar is not typed as String in typescript.

Solution 4

This simple function can do it:

public getCleanedString(cadena) {
    cadena = cadena.replace(/_/g, ' ');
    return cadena;
  }

View more solutions

Comments

[Max]

This fail if input isn't a string, or if input is null or undefined.

[Avinash Raj]

simple, just use an if stmt for condition checking.

[mediaguru]

BratisLatas I liked your method, however it appears to only replace only one instance, not multiple.

[jjmontes]

I don't think that's a valid angular expression. It does work if the first argument is a string, but if using the regular expression, I get syntax Error: Token '/' not a primary expression.

[Toto]

What question are you answering? They want to replace underscore with space.

[Sujay U N]

Where shud I add App.filter code ? and Which version of angular is this..

[John Rix]

This is for AngularJS 1.x. App here represents the object you get back from creating your Angular app as follows: var App = angular.module('myApp', ['some-dependency', 'some-other-dependency']);

[Alexis]

This is the perfect answer, simple and optimized.

[Himanshu S Shankhala]

Works well for single character replacement