How do I lowercase a field using Handlebars.js?

2020-05-19 06:34发布

问题:

I want to do something like this:

{{user.name.toLowerCase()}}

but I get this error:

Error: Parse error on line X:
...tatus {{user.name.toLowerCase()}}">  
-----------------------^
Expecting 'ID', got 'undefined'

回答1:

As simply explained in the doc :

Handlebars.registerHelper('toLowerCase', function(str) {
  return str.toLowerCase();
});

And just use it like this :

<h1>By {{toLowerCase author}}</h1>


回答2:

If you're just trying to display some text as lowercased in HTML (regardless of whether or not it's generated by handlebars), you can use CSS and apply text-transform like so:

.css-class-here {
    text-transform: lowercase;
}


回答3:

I created the following helper, but I'm curious if there's a better solution out there.

Handlebars.registerHelper('toLowerCase', function(value) {
    if(object) {
        return new Handlebars.SafeString(value.toLowerCase());
    } else {
        return '';
    }
});


回答4:

Previous answer from @Eric seems not to work now, my solution is very similar, but probably the definition of helpers changed a little in new versions of handlebars:

Handlebars.registerHelper('tolower', function(options) {
    return options.fn(this).toLowerCase();
});

and in the template

<img src="/media/images/modules/{{#tolower}}{{name}}{{/tolower}}.png"...

Cheers



回答5:

Doesn't hurt to also check and make sure it is a string and if not return nothing.

Handlebars.registerHelper('lowercase', function (str) {
  if(str && typeof str === "string") {
    return str.toLowerCase();
  }
  return '';
});

Usage :

// now let's pass a string or variable to our helper
{{lowercase 'MY NAME IS'}}

Output :

my name is