Как использовать асинхронные данные в XTemplate в ExtJS 4-5

Question

У меня есть представление данных, настроенное с помощью tpl и хранилища. Это очень хорошо. Но некоторые из переменных для каждой записи/шаблона должны выбираться последовательным шагом, вызывая другой внешний URL для каждой записи/шаблона.

Ext.define('MyView', { 
    extend: 'Ext.view.View', 
    store: 'myStore', 
    tpl: [ 
     '<tpl for=".">', 
     ' <div class="social">', 
     '  <div>{id}</div>', 
     '  <div>{firstname}</div>', 
     ' </div>', 
     '</tpl>' 
    ], 
    itemSelector: 'div.social' 
}); 

Как я могу установить некоторые переменные значения асинхронно путем вызова URL, который реагирует с объектом JSon хранящих эти значения для каждой записи в магазине после того, как те, которые отображаются в представлении с шаблоном?

В соответствии с ответом на вопрос this question on SO, это невозможно. Согласно this post, это: «Самая мощная функция опции tpl заключается в том, что данные могут быть изменены позже, чтобы обновить то, что отображается на странице».

Answer 1

Обычно вы хотите, чтобы ваш сервер возвращал все данные, которые вам нужны сразу (чтобы уменьшить количество и время запросов). Если ваш бэкэнд не может этого сделать и/или вы не можете контролировать это, вы можете посмотреть на ассоциации Ext JS.
Теоретически, как только XTemplate вызывает еще не загруженную связь, он сделает запрос на загрузку (через прокси-сервер, настроенный для модели ассоциации), который затем должен запустить событие «обновления» на запись, которая должна затем запустить событие «обновления» в хранилище, которое затем должно инициировать обновление DataView.