Подтвердить что ты не робот

Как вызвать функции в XTemplate (itemTpl)

Я хотел бы использовать метод 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 является незаконной.

Знаете ли вы, возможно ли это или как это сделать правильно?

Ответ 1

Это должно решить вашу проблему:

    '<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>'

вы можете найти дополнительную информацию о XTemplate в Sencha Docs

Вещь с функцией члена-шаблона заключается в том, что, насколько я знаю, вы не можете определить их непосредственно в 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

Это должно работать нормально, как и код ниже (просто вставьте код из XTemplate выше).

itemTpl: new XTemplate(...),

Пример Senchafiddle

Надеюсь, что это разобьет!

edit заметил, что я пропустил закрывающие теги, иногда это работает без них, но хорошая практика всегда их использовать, поскольку они могут вызвать интересные ошибки (в этом случае отсутствует скобка на сгенерированном код).

Ответ 2

Примечание. Пример ниже не работает должным образом! Посмотрите на zelexir ответ для уточнения!

Вы можете использовать функции member

itemTpl: [
    ...
    '<tpl switch="post_type">',
    '<tpl case="new_user">',
        '<p>{post_text_teaser}</p>',
        '<p>{timestamp}</p>',
    '<tpl default>',
        '<p>{[this.doAction(post_text_teaser)]}</p>',
    ...,
    {
        // XTemplate configuration:
        disableFormats: true,
        // member functions:
        doAction: function(name){
           return Ext.String.ellipsis(name + "\", 4);
        }
    }
]

Ответ 3

Вы можете использовать функцию внутри шаблона

itemTpl: [
    ...
    '<tpl switch="post_type">',
    '<tpl case="new_user">',
        '<p>{post_text_teaser}</p>',
        '<p>{timestamp}</p>',
    '<tpl default>',
        '<p>{[this.concatenate(values.post_text_teaser)]}</p>',
    ...,
    {
        concatenate: function(teaser) {
               return Ext.String.ellipsis( + teaser + \, 4);
        }
    }
]