Bessere Möglichkeit, in einer Jade-Vorlage zuerst zu arbeiten?

Question

Gibt es eine bessere Möglichkeit, das erste Zeichen einer Zeichenkette in Jade als Großbuchstaben zu schreiben?

for list in project.lists 
    - list.name = list.name.charAt(0).toUpperCase() + list.name.slice(1); 
    li #{list.name} 

dies tun jedes Mal, wenn ich profitieren wollen eine Variable hässlich ist, ist es eine Möglichkeit, in Jade, dass ich eine benutzerdefinierte Funktion definieren, die ich in jeder Vorlage zur Verfügung haben wie:

for list in project.lists 
    li #{ucfirst(list.name)} 

Dank im Voraus!

Answer 1

Der Inhalt von #{} wird als Standard JS ausgeführt, so dass Sie Hilfsfunktionen zur Verwendung mit solchen Dingen übergeben können. Sie haben nicht angegeben, aber vorausgesetzt, Sie Jade verwenden zusammen mit Express, können Sie etwas tun:

app.locals.ucfirst = function(value){ 
    return value.charAt(0).toUpperCase() + value.slice(1); 
}; 

, die eine Funktion namens ucfirst innerhalb der Jade-Vorlage aussetzen wird. Sie könnten es auch als Teil von locals bei jedem Rendern übergeben, aber wenn Sie Express verwenden, wird es automatisch tun.

Answer 2

Wenn Sie auf CSS zurückgreifen möchten, können Sie eine Klasse erstellen, die den ersten Buchstaben jedes Wortes innerhalb des Zielelements groß schreibt.

CSS

.caps { 
    text-transform: capitalize; 
} 

Jade

div.caps 
    each foo in ['one', 'two', 'three'] 
     span #{foo} 

resultierende HTML

<div class="caps"><span>one</span><span>two</span><span>three</span> 

Resultierende Ansicht

One Two Three 

Answer 3

Wenn Sie Mops verwenden mit großem Schluck, kann dies hilfreich sein:

mixin ucfirst(text) 
    - text = text.charAt(0).toUpperCase() + text.slice(1); 
    . 
     #{text} 

Ganz einfach nennen wie jede andere mixin:

li 
    +ucfirst(list.name)