Question

我们可以按如下方式使用模板：

        plugins: [{
            ptype: 'rowexpander',
            selectRowOnExpand : false,  
            rowBodyTpl: new Ext.XTemplate(
                '<p>Qusetions: {question}</p><p>',
                '<tpl for="option">',
                        '<p>{option[0]}</p>',
                    '</tpl></p>'
                )
            }]

我无法看到任何东西。我有这个JSON：

     { 
        "total": 2, 
        "data": [   
        {
        "qno":1,
        "question":"What's Your Fav color",
        "option":['red','green','blue']
        },
        {
        "qno":2,
        "question":"What's Your coom color",
        "option":['yellow','red','green','blue']
        }
     ] 
      }

模型文件

Ext.define('AM.model.Question', {
     extend: 'Ext.data.Model',
     fields: [
      {name: 'question'},
      {name: 'option'},
      {name: 'images'},
      {name: 'qno'}
]});

我希望看到输出如下：

  + Questions: What is your fav color

        <radiobutton> Red
        <radiobutton> Green
        <radiobutton> Blue

使用Ext JS 4.1版本

提前感谢您的回答

Answer 1

使用XTemplate迭代数组时，使用{.}引用当前项。您的模板应如下所示：

'<p>Questions: {question}</p>',
'<p>',
'<tpl for="option">',
    '<p>{.}</p>',
'</tpl>',
'</p>'

然而，如果你想做一个无线电组，它会变得有点棘手。 XTemplate提供parent属性来访问当前上下文之外的对象。因此，不是中间的<p>标记，您的广播组可能如下所示：

'<tpl for="option">',
    '<input type="radio" name="qno_{parent.qno}" value="{.}" />{.}<br/>'
'</tpl>'

如何在rowexpander插件中使用Template - Ext JS 4

1 个答案: