Search code examples
javascriptangulartypescriptaws-amplify

AWS Amplify i18n internationalization in angular 8


translate.ts

const dict = {
   'bh': {
      'Hello there!': "Apa khabar di sana!"   
  },
  'ch': {
      'Hello there!': "你好!"
  }
};

I18n.putVocabularies(dict);
I18n.setLanguage('ch');
I18n.get('Hello there!');

translate.html

<h3>(how to call function to get translation)</h3>

I am trying to translate website texts in different languages using AWS amplify i18n feature. I am following AWS-amplify reference https://docs.amplify.aws/lib/utilities/i18n/q/platform/js#setlanguage

But I am struggling with calling function from HTML to show in Chinese language.


Solution

  • Your "get" isn't assigned to a variable. Try assigning the get to a variable and bind it to the UI.

    this.text = I18n.get('Hello There');
    

    Then in your HTML

    <p>{{text}}</p>