把手 - 子串

Question

我是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个字符。我试图使用JavaScript substring()方法，如下所示：

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

但它显然不起作用。你能给我一些如何解决这个问题的技巧吗？感谢

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

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

Answer 1

您将要在javascript中创建Handlebars帮助程序以执行子字符串代码：

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

然后，在你的模板中，你会这样称呼它：

<p> {{{trimString content}}} </p>

Answer 2

我使用值作为选项，起始值以及作为参数形式模板传递的结束值。试试这个：

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个字符。希望这能帮助你。

Answer 3

对于那些使用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}}

Answer 4

我的字符串剪切定义助手指示

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);
});

Answer 5

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+'...');
    }
});

稍微改进了passString的验证，以及startString和Endstring的默认值。 我在截断字符串的末尾添加“...”：）

只需使用{{truncate your_text_variable 0 50}}

调用把手即可

Answer 6

是的，车把助手肯定是前进的方向;

这是我的助手，允许你指定和结束点+如果string.length＆gt;也放置“...”端。

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>

Answer 7

我正在使用此助手

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);
});

Answer 8

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

Answer 9

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

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