Search code examples
angularng2-translate

Lost in translation: Angular2, ng2-translate, database values


I have a list of countries coming from the database, to be shown in a dropdown for when users enter their address.

Using ng2-translate, is there a way to translate them?

I'd like to be able to do something like the following:

<select formControlName="country">
  <option *ngFor="let country of codesService.countries$ | async" value="{{country.code}}">{{ 'CODES.COUNTRIES.{country.code}' | translate }}</option>
</select>

With translations in a json file like:

"CODES": {
    "COUNTRIES": {
      "AF": "Afghanistan",
      "AX": "Aland Islands",
      "AL": "Albania",
      "DZ": "Algeria",
      "AS": "American Samoa",
      ...
    }
  }

But of course it doesn't work :(

Or should I have the translations in the database too and use currentLang to retrieve the entries in the desired language?


Solution

  • This did the trick:

    <select formControlName="country">
      <option *ngFor="let country of codesService.countries$ | async" value="{{country.code}}">{{ 'CODES.COUNTRIES.' + country.code | translate }}</option>
    </select>