14

我是Handlebars模板系统的新手，这是我使用 Handlebars 开展的第一个项目。我创建了简单的模板：

<script id="article_list_template" type="text/x-handlebars-template">
    {{#each this}}
    <div class='article'>
    <a href='article.php?id={{id_news}}' data-article_id='{{id_news}}'>
        <h1>{{title}}</h1>
    </a>
        <p> {{{content}}} </p>
    <div style='clear: both;'> </div>
    </div>
    {{/each}}
</script>

退货content时间很长。我希望它更短，例如 150 个字符。我试图使用 JavaScriptsubstring()方法如下：

<p> {{{content.substring(0,150)}}} </p>

但这显然不起作用。你能给我一些提示如何处理这个问题吗？谢谢

编辑：好的，问题解决了：我已经在 PHP 中完成了，所以返回的内容现在有适当的长度：

foreach ($articles as $a) {
    $a->content = cut_text( $a->content, 30);
}
4

9 回答 9

29

您将要在 javascript 中创建一个 Handlebars 助手来执行子字符串代码：

Handlebars.registerHelper('trimString', function(passedString) {
    var theString = passedString.substring(0,150);
    return new Handlebars.SafeString(theString)
});

然后，在您的模板中，您可以这样称呼它：

<p> {{{trimString content}}} </p>
于 2012-07-26T21:52:10.383 回答
24

我使用值作为选项、起始值以及作为参数表单模板传递的结束值。尝试这个：

Handlebars.registerHelper('trimString', function(passedString, startstring, endstring) {
   var theString = passedString.substring( startstring, endstring );
   return new Handlebars.SafeString(theString)
});

在模板中：

<p>{{{trimString value 0 300}}}</p>

它将打印值的前 300 个字符。希望这对您有所帮助。

于 2014-09-23T11:01:33.200 回答
4

对于那些使用 EmberJS 的人，这是我对 substr 助手的解释：

Ember.Handlebars.registerHelper('substr', function(property, options) {

    var str = Ember.get(this, property);
    var opts = options.hash;

    var start = opts.start || 0;
    var len = opts.max;

    var out = str.substr(start, len);

    if (str.length > len)
        out += '...';

    return new Ember.Handlebars.SafeString(out);
});

使用示例：

{{substr description start=5 max=20}}

或者

{{substr description max=20}}

编辑： “绑定”助手甚至更好。

Ember.Handlebars.registerBoundHelper('substr', function(value, options) {

    var opts = options.hash;

    var start = opts.start || 0;
    var len = opts.max;

    var out = value.substr(start, len);

    if (value.length > len)
        out += '...';

    return new Ember.Handlebars.SafeString(out);
});

这也适用于嵌套属性：

{{substr view.product.description max=50}}
于 2013-09-19T11:55:08.077 回答
1

我用字符串切割定义助手指示

Handlebars.registerHelper('trimS', function(passedString, start, length ){
var mlength = length,preS='',tailS='';
if(start>0 && passedString.length>3){
    var preS= '...';
    mlength = length -3;
} ;
if(passedString.length>(start + length )){
    tailS = '...';
    mlength = mlength -3;
};
var theString = preS + passedString.substr(start, mlength) + tailS;
return new Handlebars.SafeString(theString);
});
于 2012-09-24T15:26:56.240 回答
1

是的，车把助手绝对是前进的方向；

这是我的助手，它允许您指定和结束点 + 如果 string.length > end 也放置“...”。

Handlebars.registerHelper('substring', function( string, start, end ) {

    var theString = string.substring( start ,end );

    // attach dot dot dot if string greater than suggested end point
    if( string.length > end ) {
      theString += '...';
    }

    return new Handlebars.SafeString(theString);
});

模板内部：

<p>{{{substring myString 0 100}}}</p>
于 2013-08-29T10:01:10.753 回答
1 

Handlebars.registerHelper('truncate', function(passedString, startstring, endstring) {
    if(passedString){
        if(!startstring) startstring=0;
        if(!endstring) endstring=30;
        var theString = passedString.substring( startstring, endstring );
        return new Handlebars.SafeString(theString+'...');
    }
});

只是对passedString的验证做了一点改进，startString和Endstring的默认值。我在截断字符串的末尾添加 '...' :)

只需使用 {{truncate your_text_variable 0 50}} 调用车把

于 2015-06-08T08:39:53.350 回答
0

我正在使用这个助手

Handlebars.registerHelper('truncate', (value, options) => {
  const opts = options.hash;
  const max = opts.max || '250';
  const out = value.substring(0, max);
  return new Handlebars.SafeString(value.length > max ? `${out}...` : out);
});
于 2019-01-21T12:39:22.053 回答
-1

我已经用 PHP 解决了我的问题。我修改了 PHP 脚本，现在返回的内容有适当的长度。

foreach ($articles as $a) {
    $a->content = cut_text( $a->content, 30);
}
于 2012-04-17T10:16:33.700 回答
-2

或者，您可以编写一个车把辅助函数来执行子字符串

于 2012-04-16T07:25:08.807 回答