Question

例如，我有以下网格：

Value | Currency
------|---------
12.32 | EUR
14.00 | JPY

日元不使用小数，所以我想知道ExtJS是否可以指定每个单元格的小数位数。在这种情况下，JPY只显示14而不是14.00。

我看过the number column，但从我看到的情况来看，没有选择指定单元格的格式。

如何在ExtJS网格中指定单元格的格式？

Answer 1

您可以使用列渲染器来执行此操作。您检查货币的值，如果是JPY，则显示不带小数的值：

http://docs.sencha.com/extjs/4.2.0/#!/api/Ext.grid.column.Column-cfg-renderer

    columns: [{
                text: "Value",
                flex : 1,
                dataIndex: 'value',
                renderer: function(value, metaData, record){
                      if (record.data.currency === 'JPY') {
                           return Ext.util.Format.number(value, '0');
                      } 
                      return value;
                }},
                {text: "currency", flex : 1, dataIndex: 'currency'}]

这是一个有效的小提琴：http://jsfiddle.net/Xpe9V/1608/

Answer 2

虽然这个问题似乎得到了回答，但我想指出一个完全不同的方向。为什么不转换model的{{1}}（记录）上的值？ 这种方法的优点是您不必担心应用程序中的任何值，例如过滤，在表单上显示它或其他任何内容。

store

有关模型领域和可能性的更多信息：
http://docs.sencha.com/extjs/6.0/6.0.0-classic/#!/api/Ext.data.field.Field

Answer 3

您可以实现一个自定义网格单元格，该单元格在货币单元格中查找该值，然后执行该值的格式设置。

类似的东西：

Ext.define('xxx.view.dynamicdatagrid.CustomCurrencyValueFormatterColumn',
{
extend: 'Ext.grid.column.Column',
xtype: 'customCurrencyValueFormatterColumn',


renderer: function (value, metaData, record, row, col, store, gridView) {

   var returnValue ='';
  //look here in the record parameter for the value in the currency 
   var currency = row.data.Currency;

  //make a switch and call a custom formatter function dependend on the currency
   switch(currency){
       case 'Yen':
         returnValue = customFunction(value);
         break;
        ....
   }

 return returnValue;

},

initComponent: function () {
    var me = this;
    this.callParent();
}

}）;

Answer 4

您可以通过省略其配置中的xtype字段将列类型设置为默认值。

在您的网格的字段属性中，使用＆＃39; convert＆＃39;函数以编程方式格式化每个值。例如：

var fields = [      
        {
            name: 'value', type: 'string', mapping: 'value',
            convert: function (v, record) {
               if (record.data.currency === 'JPY') {
                  // format your string here
                  // var value = ...
                  return value;
               }
            }
        },                 
    ];

如何在ExtJS网格中指定单元格的格式？

4 个答案: