如何在 XTemplate extjs 4 中调用函数

Question

这是我的观点

Ext.define('ValidationErrorView', {
    extend : 'Ext.panel.Panel',
    alias : 'widget.validationErrorView',
    layout : 'fit',
    overflow : 'auto',
    autoScroll : true,
    xTitle : 'Title',
    XFun :function(name){
        return "Hello " + name;
    }

    border : false,

    initComponent : function() {
        var tpl = new Ext.XTemplate(
            '<tpl for=".">',
            '<div>{xTitle}',
            '<p>{[xFun(name)]}',
            '</div>',
            '</tpl>'
        );
    }   
});

我想在我的模板中使用 xTitle 和 xFun()。 我正在使用 {[..]} 来调用我的函数，但这不起作用？ 如何在模板中同时使用 xTitle 和 XFun() ？

Answer 1

以以下格式调用该函数：

initComponent : function() {
    var tpl = new Ext.XTemplate(
        '<tpl for=".">',
        '<div>{xTitle}',
        '<p>{[this.xFun(name)]}',
        '</div>',
        '</tpl>',
        {
            XFun :function(name){
               return "Hello " + name;
            }
        }
    );
}

这肯定可以工作。我删除了initComponent（）之外的函数Xfun。

Answer 2

initComponent : function() {
  var tpl = new Ext.XTemplate(
    '<tpl for=".">',
    '<div>{xTitle}',
    '<p>{[this.xFun(values.name)]}',
    '</div>',
    '</tpl>',
    {
      XFun :function(name) {
        return "Hello " + name;
      }
    }
  );
}

this values.X （你所指的变量名）对我this values.X 。 并且 xTitle 可以从 XFun 函数中访问，例如 this.xTitle..