Sencha touch list tpl с вложенными данными

Question

Я новичок в sencha. Я создаю структуру MVC, используя архитектуру sencha, прикоснитесь к версии 2.2.x.

Я хочу показать вложенные данные в элемент управления списком, но я не уверен, как определить tmp.

Вот пример возврата данных с сервера

{ 
"data": 
[ 
    {"AcctId": 1, "AcctNum": "A", "Alias": "aa"}, 
    {"AcctId": 2, "AcctNum": "B", "Alias": "bb"}, 
    {"AcctId": 3, "AcctNum": "C", "Alias": "cc"} 
] 
} 

это модель, я определяю вложенную модель

Ext.define('MyApp.model.Data', { 
    extend: 'Ext.data.Model', 

    uses: [ 
     'MyApp.model.LoginAlias' 
    ], 

    config: { 
     hasMany: { 
      model: 'MyApp.model.LoginAlias', 
      name: 'LoginAlias' 
     } 
    } 
}); 

Ext.define('MyApp.model.LoginAlias', { 
    extend: 'Ext.data.Model', 

    config: { 
     fields: [ 
      { 
       name: 'AcctId' 
      }, 
      { 
       name: 'AcctNum' 
      }, 
      { 
       name: 'Alias' 
      } 
     ] 
    } 
}); 

Это магазины, чтобы получить данные, это будут данные кросс-сервер, поэтому я использую JSONP

Ext.define('MyApp.store.MyJsonPStore', { 
    extend: 'Ext.data.Store', 

    requires: [ 
     'MyApp.model.Data' 
    ], 

    config: { 
     autoLoad: true, 
     model: 'MyApp.model.Data', 
     storeId: 'MyJsonPStore', 
     proxy: { 
      type: 'jsonp', 
      url: 'http://localhost:8000/test/get_alias/', 
      reader: { 
       type: 'json' 
      } 
     } 
    } 
}); 

Наконец Список

Ext.define('MyApp.view.MyList', { 
    extend: 'Ext.dataview.List', 

    config: { 
     store: 'MyJsonPStore', 
     itemTpl: [ 
      '<div>List Item {AcctId}</div>' 
     ] 
    } 

}); 

Я вижу, что Магазин может получать данные с сервера в Sencha Architect, щелкнув значок «глаз» рядом с Магазином.

Я пробую Список tpl с data.AcctId или сменю List store в MyJsonPStore.data, но все не работают.

Пожалуйста, помогите, спасибо большое.

p/s: Я пытаюсь использовать не вложенную модель, и список работает нормально. И это основной файл JS, в случае необходимости

Ext.Loader.setConfig({ 

}); 

Ext.application({ 
    models: [ 
     'Data', 
     'LoginAlias' 
    ], 
    stores: [ 
     'MyJsonPStore', 
     'MyStore' 
    ], 
    name: 'MyApp', 

    launch: function() { 

     Ext.create('MyApp.view.MyList', {fullscreen: true}); 
    } 

}); 

Answer 1

1. Структура данных

Не уверен, что это полезно для определения MyApp.model.Data, как это только корень вашего списка данных. Таким образом, вы могли бы отдать логику hasMany.

2. Представление данных

Ext.dataview.List предназначен для отображения только простые списки. Для вложенных списков рассмотрите расширение Ext.dataview.NestedList. (но если 1. это правда, вам это не понадобится).

3. Доступ к данным

Чтобы получить прямой доступ к данным, необходимым для отображения, просто добавьте rootProperty: 'data' к объекту для чтения конфигурации вашего прокси-сервера:

proxy: { 
    type: "jsonp", 
    url: 'http://server.ext/path/to/MyApp/app/data/sample.ashx', 
    reader: { 
     type: "json", 
     rootProperty: 'data' 
    } 
}