Is it possible use ngx-translate with Teradata Covalent Dynamic form?

Question

I'd like to know if its possible to use ngx-translate with Covalent Dynamic forms. My template is shown below:

<td-dynamic-forms [elements]="dataElements">
</td-dynamic-forms>

My dataElements array:

this.dataElements = [
  {
    'name': 'name',
    'label': 'NAME',
    'type': 'text',
    'disabled': true,
    'required': true,
    'default': this.application ? this.application.name : ''
  },
  {
    'name': 'description',
    'label': 'DESCRIPTION',
    'type': 'textarea',
    'required': false,
    'default': this.application ? this.application.description : ''
  },
];

I'd like to translate the labels using ngx-translate. I'm using the same in other regular forms, but I wanted to know if its possible to use the translation in Dynamic Forms.

Answer 1

You can define Label field using getter in your object and execute operations you need inside the method. When dynamic form is created it calls for getter label and receives localized value.

To access the translation service you can add instance as a new field in the object and have an access to it using this.translateService in label() method.

    this.dataElements = [
      {
        'name': 'name',
        'type': 'text',
        'disabled': true,
        'required': true,
        'default': this.application ? this.application.name : '',
        'translateService': this.translateService, //add translation service instance to the object 
         get label() {
              return this.translateService.get("NAME").value;//get traslation by key.
            }
      },
      {
        'name': 'description',
        'type': 'textarea',
        'required': false,
        'default': this.application ? this.application.description : '',
        'translateService': this.translateService,
         get label() {
              return this.translateService.get("DESCRIPTION").value;
            }
      },
    ];