How to change label metric in angular slickgrid?

Question

I try to change footer label metric in angular slickgrid.
enter image description here
Code:

this.gridOptions = {
showCustomFooter: true,
customFooterOptions: {
    metricTexts: {
      items: 'items1',
      of: 'of1',
    }
  }
}

but in result when I use angular.slickgrid.getOptions() I get nothing changes.

...
metricText: {
  items: "items"
  itemsKey: "ITEMS"
  lastUpdate: "Last Update"
  of: "of"
  ofKey: "OF"
}
...

I expected that this sample code change my label metric

Software Version:
Angular : 9.0
Angular-Slickgrid : 2.18.6
TypeScript : 3.75

Answer 1

Note that I'm the author of Angular-Slickgrid

That was a bug in the lib itself and is now fixed in latest version 2.18.7.

You were right in the use, I'll just put them here again to maybe help others and make more emphasis on the differences when you use (or not) the Translate Service (ngx-translate). The main difference is that anytime you want to use Translations in Angular-Slickgrid then you'll have properties/options which usually ends with the Key suffix (for example: itemsKey: 'ITEMS', nameKey: 'NAME', ...).

Without Translate Service

this.gridOptions = {
  showCustomFooter: true, 
  customFooterOptions: {
    metricTexts: {
      items: 'custom items',
      of: 'custom of',
      lastUpdate: 'custom update',
    },
    dateFormat: 'yyyy-MM-dd hh:mm aaaaa\'m\'',
    hideTotalItemCount: false,
    hideLastUpdateTimestamp: false,
  },
};

With Translate Service

this.gridOptions = {
  enableAutoResize: true,
  i18n: this.translate, // <-- Translate Service
  showCustomFooter: true, 
  customFooterOptions: {
    metricTexts: {
      itemsKey: 'CUSTOM_ITEMS_KEY',
      ofKey: 'CUSTOM_OF_KEY',
      lastUpdateKey: 'CUSTOM_LAST_UPDATE_KEY',
    },
    dateFormat: 'yyyy-MM-dd hh:mm aaaaa\'m\'',
    hideTotalItemCount: false,
    hideLastUpdateTimestamp: false,
  },
};