在Jade模板中使用ucfirst的更好方法是什么？

Question

是否有更好的方法来将Jade中字符串的第一个字符大写比这更好？

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

每次我想要变量大写这样做都很难看,有没有办法在Jade中我可以定义一个我在每个模板中都可用的自定义函数,如:

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

提前致谢!

Answer 1

其内容#{}以标准JS 的形式执行,因此您可以传入辅助函数以用于此类事务.您尚未指定,但假设您正在使用Jade以及Express,您可以执行以下操作:

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

这将公开ucfirst在Jade模板中调用的函数.您也可以在locals每次渲染时将其传入,但如果您使用Express,则会自动执行此操作.

Answer 2

如果您愿意使用 CSS，您可以创建一个类，将目标元素中每个单词的第一个字母大写。

CSS

.caps {
    text-transform: capitalize;
}

玉

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

结果 HTML

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

结果视图

One Two Three