How to translate an Array with ngx-translate?

Ionic Framework ionic-v3
1

Hi
I’m using ngx-translate for make the translation of my app in Ionic, untill now all was fine. But when i had to translate an array my happiness end.

I have this array in my TS file:

maritalstatusgroup: Array<any> = [
    { "key": "D", "label": "Divorced or Legally Separated" },
    { "key": "M", "label": "Married" },
    { "key": "​S", "label": "Never Married" },
    { "key": "T", "label": "Domestic partner" },
    { "key": "W", "label": "Widowed" }

And I use it into my HTML file, in this way:

 <ion-option *ngFor="let mst of maritalstatusgroup" value="{{mst.key}}">{{mst.label}}</ion-option>

And all works fine. But… The big question is… how should I implement the translation in this scenario?

Thanks for all the help.

3

I would replace the label or your array with the translation key, like

 maritalstatusgroup: Array<any> = [
     { "key": "D", "label": "DIVORCED" },
     { "key": "M", "label": "MARRIED" },
     { "key": "​S", "label": "NEVER_MARRIED" },
     { "key": "T", "label": "PARTNER" },
     { "key": "W", "label": "WIDOWED" }]

and then use the translate pipe (see | translate)

 <ion-option *ngFor="let mst of maritalstatusgroup" value="{{mst.key}}">{{mst.label | translate}}</ion-option>

Is that what you are looking for?

1 Like
4

@reedrichards

Thanks!! it works :clap:

1 Like
5

Cool to hear it worked out, have fun :wink:

6

check out the ionic-super-starter template. it incorporates internationalization neatly.
the LANGCODE.json of course accepts arrays as well.

7

Hi,

Make translation pipes, I use it in my app and it works like wonders.

François

8

@yardarrat
Thanks! I will test it soon for me incoming projects!