javascript - ExtJS4 模板参数

Question

我是 extJs4 的新手，我想了解模板的工作原理。

我的问题是:如何将函数作为参数传递给模板？ 例如，我有一个“a”元素，我想用我的 extjs 自定义类中定义的自定义函数来处理它的“onClick”事件。

我设法做的是传递一个函数 foo() 作为参数，其中有一个简单的警报。 问题是警报在应用程序加载时被触发，但之后单击该元素时没有任何反应。在检查元素时，我看到它的 onclick 处理程序是一个空字符串。

谢谢。

Answer 1

模板仅用于数据呈现，任何处理与用户交互的逻辑都必须在包含元素或其子元素中完成，下面是如何使用模板:

Ext.onReady(function(){
    //Some dummy data
    var data = { name: 'Jerónimo', age: 37 };

    // Declare a template to use, very simple.
    var tpl = new Ext.XTemplate(
        '<H1>Template sample:</H1>',
        '<tpl for=".">',
        '<p>Name: {name}</p>',
        '<p>Age: {age}</p>',
        '</tpl>'
    );

    // Apply the template to our div
    tpl.overwrite('myDiv', data);

    // Control the click event on the div
    Ext.get('myDiv').on('click', function(){ alert('Click'); });
})

您可以在此处查看工作示例:JsFiddle Ext 4.0.7 template example

希望对理解模板用法有所帮助。