一般来说,在ExtJS应用程序上逃避HTML的最佳方法是什么？

Question

我正在使用ExtJS开发一个Web应用程序来构建GUI并通过RESTful Web服务与服务器通信(返回的数据格式化为JSON对象).
现在我在使用包含HTML标签,内部Javascript代码的数据进行处理时遇到问题; 因为当我将这些值设置为Ext表单,标签,输入字段时,它们会受到这些语法的影响.
我使用此函数从模型对象加载数据到表单:

form.loadRecord(model);

我找到了一个逃避HTML和JS的解决方案:使用

field.setValue(Ext.util.Format.htmlDecode(data)); 

但我认为这对整个应用程序来说不是一个好的解决方案,因为开发人员必须做很多事情:查看所有输入字段,标签,并将该代码段放到它们.毕竟,这不是构建快速,强大和可维护应用程序的美妙方式.
那么,请你帮我解决方案,以便可以在一个地方进行修改,并影响其余部分.我可以覆盖AbstractComponent的setValue/setLabel吗？或者我应该在渲染之前对数据进行编码？以及如何解码这些数据？(P/S:我在服务器端使用Grails框架)非常感谢你.

Answer 1

如果您使用的是Ext.XTemplate,则可以在以下字段中转义html:

var tpl = new Ext.XTemplate(
    '<p>My Field: {myField:htmlEncode}</p>'
);

Answer 2

一切都取决于你的用例,但我所做的是 - 逃避服务器端的所有HTML代码,以便错误地没有"遗忘"的地方.当这些数据需要在表单字段中加载时,这当然会产生问题,因为它们是转义的.最简单的解决方案是覆盖所有表单字段的setValue,并使用Extjs htmlDecode函数,这将使这些值恢复正常.

Ext.override(Ext.form.field.Base, {
    setValue: function(val) {
        val = Ext.util.Format.htmlDecode(val);
        return this.callParent([val]);
    }
});