0

我正在尝试显示来自网络服务器 json 的数据,但它没有显示在视图中。起初我试图只显示消息但无法成功。按照@rdougan 提供的此链接和示例,我已经能够解析到类别但无法解析后一个值,任何人都可以指导我。我到目前为止所做的代码如下:

{
    xtype: 'panel',
    padding: '20px',        
    //height: 100,        
    styleHtmlContent:true,
    store: 'TodaysWordStore',
    models: 'TodaysWordModel',

        tpl: 
        [
        '<tpl for=".">',
        '<ul class="parabox">',
        '<li><h2 onclick = "ratingStar()">{message} </h2> ',
        '<ul class="para-box-wrapper">',
        '<li class="greenbox"><div class="paragraph-def">',
        '{dictionaryDef}',
        '<span class="authorBox">Author: {authorName}</span>',
        '</div><div class="starBox">',
        '{ratingBox}',
        '</div></li>',
        '</ul></li></ul>', 
        '</tpl>',
        ]
       // '<div><strong>{dictionaryWord}</strong>, {dictionaryDef} <em class="muted">({role})</em></div></tpl>']
  },

我的商店是

Ext.define('appname.store.TodaysWordStore',{
extend: 'Ext.data.Store', 

config:
{
model: 'appname.model.TodaysWordModel',
autoLoad:true,
proxy:
{
    type: 'ajax',
    url : 'location' //Your file containing json data
    reader:
    {
        type: 'json',
            //rootProperty:'accountInfo'
    }
}
}
});

我的模型是

Ext.define('appname.model.TodaysWordModel', {
extend: 'Ext.data.Model',
config: {
fields:[

   {name: 'message', mapping: 'accountInfo.message'}
]
}
});

我要解析的json

 ({"accountInfo":
{"expire_date":"2014-07-02 08:01:09",
"subscribe_date":"2013-07-02 08:01:09",
"time_remain":" 358 Days 1 Hour 24 Minutes",
"status":"not expired"},
"status":"TRUE",
 "message":"Todays Word",
"data":
[{"name":"curtain",
"author":"admin",
"word_id":"35",
"category":"business",
"definition":
[{"rating":
{"red":"0",
"green":"1",
"yellow":"0",   
"total_rating":1,
"final_rating":"Green"},
"defintion":"curtain",
"def_id":"11",
"example":"This is a sample example.",
"author":"admin"},
{"rating":
{"red":0,
"green":0,
"yellow":0,
"total_rating":0,
"final_rating":"This definition is not rated yet."},
"defintion":"to cover something",
"def_id":null,
"example":"This is curtain example.",
"author":"admin"}],
"is_favourite":"No"}]})

帮我

4

2 回答 2

1

panel当您应该使用 a 时,您正在尝试使用 a dataview。在使用 时tpl, 应该与dataconfig 选项一起使用Ext.panel.Panel,其中data只是一个包含要由tpl. 但是,当您store对数据使用 a 时,您应该使用 anExt.view.view而不是panel. 请参阅此处的文档:http: //docs.sencha.com/extjs/4.2.1/#!/api/Ext.view.View

于 2013-07-10T11:36:29.293 回答
0

我通过添加一个额外的 itemTpl 来解决它。由于我只有 tpl 用于数据,因此无法从定义节点获取数据。

{
   xtype: 'list',
   store: 'ghak',
   height: 140,
   layout: 'fit',
  scrollable: {  
        direction: 'vertical',
        directionLock: true,
      },
       margin: '0 0 5px 0',

       itemTpl: [
       '<div>',                
       '<tpl for="data">',
       '<ul class="parabox">',
       '<li><h2 class="noStar" onclick = "addtofavourite({word_id})">{name} </h2>',                          
       '<tpl for="definitions">',
       '<ul class="para-box-wrapper">',
       '<li class="{rating}"><div class="paragraph-def" onclick = "rating({def_id})">','{defintion}',
       '<span class="authorBox">Author: {author}</span>',

       '</li>' ,
    '</div>',
    '</ul></li>', 
    '</tpl>',
    '</ul>',
    '</tpl>',
    '</div>'
    ].join('')

希望它会帮助某人。谢谢。

于 2013-08-01T08:54:04.850 回答