简体   繁体   中英

Date formating in handson table

I am using handson table lib in my angular project. have a date column and i want the dates to be formatted like that DD/MM/YYYY at the init of the table but unfortunately nothing is happened and even when i call afterRender() in angular's hooks(after view init and after view checked ) it tolds me cannot render of undefined so it's like the table is undefined at this time. So what is the sollution for that? this is afterRender method

private afterRender( ) {
  console.log("rendere")
  this.hotRegisterer.getInstance(this.idTableau).render();
  this.hotRegisterer.getInstance(this.idTableau).validateCells();
}

this is my settings

hotSettings: Handsontable.GridSettings = {
  height: MajStockComponent.HANDSON_TABLE_HEIGHT,
  width: MajStockComponent.HANDSON_TABLE_WIDTH,
  stretchH: 'all',
  rowHeaderWidth: MajStockComponent.HANDSON_TABLE_ROW_HEADER_WIDTH,
  colWidths: MajStockComponent.HANDSON_TABLE_COL_WIDTH,
  colHeaders: MajStockComponent.HANDSON_TABLE_IS_COL_HEADER,
  licenseKey: ConstantesNuc.LICENCE_KEY_TABLE_HANDSOME_TABLE,
  language: ConstantesNuc.HANDSOME_FR,
  columns: [
    {
      data: "code",
      type: 'text',
      readOnly: true
    },
    {
      data: "num",
      type: 'text',
      readOnly: true
    },
    {
      data: "date",
      type: 'date',
      readOnly: true,
      dateFormat: 'DD/MM/YYYY',
      correctFormat: true,
    },
  ],
  nestedHeaders: [
    [{
      label: '',
      colspan: 3
    }],
    ['Code ', 'Num ', 'Date']
  ],
  afterLoadData: (bool) => {
    this.afterRender();
  },
}

Hi you have make to custom cell render for your date cell.

 columns: [
    {
      data: "code",
      type: 'text',
      readOnly: true
    },
    {
      data: "num",
      type: 'text',
      readOnly: true
    },
    {
      data: "date",
      type: 'date',
      readOnly: true,
      renderer: function(instance, td, row, col, prop, value, cellProperties) {
      dateCell = value,  // format your date value with custom pipe.
      return dateCell;
      }
    },
  ],

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM