javascript - 如何在XTemplate(itemTpl)中调用函数

我想在将输出到 View 的某些文本上使用Ext的String方法。

例如:

itemTpl: [
    ...
    '<tpl switch="post_type">',
    '<tpl case="new_user">',
        '<p>{post_text_teaser}</p>',
        '<p>{timestamp}</p>',
    '<tpl default>',
        '<p>' + Ext.String.ellipsis( + '{post_text_teaser}' + \, 4) + '</p>',
    ...
].join(''),

但是第10行中的串联当然是非法的。

您知道是否可行或如何正确执行此操作？

最佳答案

这应该可以解决您的问题:

    '<tpl switch="post_type">',
        '<tpl case="new_user">',
            '<p>{post_text_teaser}</p>',
            '<p>{timestamp}</p>',
        '<tpl default>',
            '<p>{[Ext.String.ellipsis(values.post_text_teaser,4,false)]}</p>',
    '</tpl>'

您可以在Sencha Docs上找到有关XTemplate的更多信息。

模板成员函数的作用是，据我所知，您不能以常规方式直接在itemTpl中定义它们，而需要显式定义一个新的XTemplate，然后在itemTpl中使用它。参见示例:

var tpl = new XTemplate(
    '<tpl switch="post_type">',
        '<tpl case="new_user">',
            '<p>{post_text_teaser}</p>',
            '<p>{timestamp}</p>',
        '<tpl default>',
            '<p>{[this.shorten(values.post_text_teaser)]}</p>',
    '</tpl>',
    {
        shorten: function(name){
           return Ext.String.ellipsis(name,4,false);
        }
    }
);

...

itemTpl: tpl,

...

Senchafiddle example

这应该可以正常工作，就像下面的代码一样(只需从上面的XTemplate中插入代码即可)。

itemTpl: new XTemplate(...),

Senchafiddle example

希望这能解决它!

编辑注意到我错过了结束标记，有时在没有结束标记的情况下也可以使用，但是最好始终使用它们，因为它们会引起有趣的错误(在这种情况下，生成的代码中缺少括号)。