Как я могу использовать TreeStore с автоматическими отображениями? - PullRequest
4 голосов
/ 03 мая 2011

У меня есть модель, которая выглядит так:

Ext.regModel('TreeItem', {
    fields: [
             { name: 'ItemId', type: 'int' },
             { name: 'ItemType', type: 'string' },
             { name: 'Article', type: 'auto' },
             { name: 'Container', type: 'auto' },
             { name: 'Category', type: 'auto'}]
});

ItemType указывает, должен ли этот конкретный элемент отображаться как Статья, Контейнер или Категория. Каждый из объектов Article, Container и Category имеет связанные ArticleName, ContainerName и CategoryName.

Я бы хотел отобразить эти имена в NestedList на основе ItemType записи. Поэтому я переопределил getItemTextTpl так:

getItemTextTpl: function (recordnode)
            {
                var template = '<div class="{ItemType}-icon"></div>';
                if (recordnode.firstChild.attributes.record.data["ItemType"] == 'Article')
                {
                    template += recordnode.firstChild.attributes.record.data['Article']["ArticleName"];
                }
                if (recordnode.firstChild.attributes.record.data["ItemType"] == 'Container')
                {
                    template += recordnode.firstChild.attributes.record.data['Container']["ContainerName"];
                }
                if (recordnode.firstChild.attributes.record.data["ItemType"] == 'Category')
                {
                    template += recordnode.firstChild.attributes.record.data['Category']["CategoryName"];
                }
                return template;   
            }

Однако, похоже, что getItemTextTpl вызывается только один раз для каждого уровня дерева, поэтому нет способа визуализировать информацию для каждого элемента списка.

У кого-нибудь есть предложения, как этого добиться? Заранее спасибо.

Ответы [ 2 ]

3 голосов
/ 03 мая 2011

Вы должны переместить вашу условную логику из функции в шаблон.Вот пример, который демонстрирует, как вы будете это делать (хотя вам, вероятно, придется изменить его, чтобы заставить его работать):

getItemTextTpl: function (recordnode)
    {
        var template = '<div class="{ItemType}-icon"></div>' +
            '<tpl if="ItemType === \'Article\'">' +
                '{ArticleName}' +
            '</tpl>' +
            '<tpl if="ItemType === \'Container\'">' +
                '{ContainerName}' +
            '</tpl>' +
            '<tpl if="ItemType === \'Category\'">' +
                '{CategoryName}' +
            '</tpl>' +
        '</div>';
        return template;   
    }

Я создал NestedList demo , который используетэта техника.Код на github , а также скринкаст , демонстрирующий, как он был построен.Возможно, вы также захотите посмотреть мои две серии скринкастов на тему Xtemplates ( часть первая и часть вторая )

0 голосов
/ 14 июля 2011

Этого нельзя сделать.Я обобщил свои объекты и использовал обычные отображения.Вы не можете использовать автоматическое сопоставление с шаблоном.

...