Sencha 2.4.1 - 목록이 표시되지 않음

Question

Sencha touch 2.4.1을 사용하여 상점에 정적 데이터로 목록을 채우려고합니다.

하나의 기본보기에는 제목 표시 줄과 목록이 있습니다. 이 목록은 저장소 기반 모델 인 Employee에서 데이터를 가져 오려고합니다.

다음 코드 스 니펫은 어디에 잘못 표시되는지 알 수 없습니다.

직원 목록보기

Ext.define('MyApp.view.EmpList',{ 
    extend: 'Ext.List', 
    xtype: 'emp_list', 
    config:{ 
     itemTpl: Ext.XTemplate('<span>{firstname}</span>') 
    } 
}); 

직원 스토어

Ext.define('MyApp.store.Employee',{ 
extend: 'Ext.data.Store', 
config:{ 
    storeId: 'emp_store', 
    model: 'MyApp.model.Employee', 
    emptyText: 'No Employees Yet!', 
    data:[ 
     {firstname:'Danish', lastname:'Siddiqui', ranking:'1', is_manager:false}, 
     {firstname:'Danish', lastname:'Siddiqui1', ranking:'2', is_manager:false}, 
     {firstname:'Danish', lastname:'Siddiqui2', ranking:'3', is_manager:false}, 
     {firstname:'Danish', lastname:'Siddiqui3', ranking:'4', is_manager:false}, 
    ] 
} 

}); 

직원 모델

Ext.define('MyApp.model.Employee',{ 
extend: 'Ext.data.Model', 
config: { 
    fields:[ 
     {name: 'firstname',  type:'string'}, 
     {name: 'lastname',  type:'string'}, 
     {name: 'ranking',  type:'number'}, 
     {name: 'is_manager', type:'boolean', defaultValue: false} 
    ] 
} 

}); 직원 저장소에

홈페이지보기

Ext.define('MyApp.view.Main', { 
extend: 'Ext.Container', 
xtype: 'main', 
requires:[ 
    'Ext.TitleBar' 
], 
config: { 
    items: [ 
     { 
      xtype: 'titlebar', 
      title: 'Employe Information', 
      items:[ 
       { 
        xtype: 'button', 
        ui: 'back', 
        text: 'back' 
       } 
      ] 
     }, 
     { 
      xtype: 'emp_list', 
      store: 'emp_store' 
     } 
    ] 

} 
}); 

Answer 1

목록의 너비 및 높이 속성 설정이 작동합니다. 당신이 언급 한 바와 같이

config:{ 
    width: '100%', 
    height: '100%', 
    itemTpl: Ext.XTemplate('<span>{firstname} &nbsp; {lastname}</span>'), 
    store: 'emp_store' 
} 

Answer 2

모델, 그것은 안 'MyApp.model.Employee'을 읽어야? 도움이되지 않으면 매장에서 무엇을 얻을 수 있는지보십시오. 저장소에 예상되는 레코드가로드되어 있습니까?

Answer 3

, 당신으로 인해 오히려 그 위해 xtype의 인스턴스보다 xtype의 참조에 또한 상점이 목록에로드하지 않습니다 height 및 width하지만를 추가하여 목록을 몇 가지 크기를 제공했다 . http://docs-origin.sencha.com/touch/2.4/2.4.1-apidocs/#!/api/Ext.dataview.List-cfg-store

그래서 Main보기는 다음과 같아야합니다

Ext.define('MyApp.view.Main', { 
    extend: 'Ext.Container', 
    xtype: 'main', 
    renderTo: Ext.getBody(), 
    requires: ['Ext.TitleBar'], 
    config: { 
     fullscreen: true, 
     items: [{ 
      xtype: 'titlebar', 
      title: 'Employe Information', 
      items: [{ 
       xtype: 'button', 
       ui: 'back', 
       text: 'back' 
      }] 
     }, { 
      xtype: 'emp_list', 
      store: Ext.create('MyApp.store.Employee'), 
     }] 

    } 
}); 

이처럼 EmpList :

Ext.define('MyApp.view.EmpList', { 
    extend: 'Ext.List', 
    xtype: 'emp_list', 
    config: { 
     width: '100%', 
     height: '100%', 
     itemTpl: Ext.XTemplate('<span>{firstname}</span>') 
    } 
}); 

데모 : https://fiddle.sencha.com/#fiddle/gqr

Answer 4

당신은 저장소를로드해야합니다 및 app.js 파일의 모델

stores: ['Employee'], 
models: ['Employee']