CODEWITHSUNDEEP
javascriptinternationalizationadobeaemtranslate
daitienshi
daitienshi

Reputation: 201

AEM 6.x: How to access i18n translations via Javascript?

I'm trying to dynamically retrieve a translated message using Javascript from my created dictionary in AEM's translator (/libs/cq/i18n/translator.html).

We've got dictionary values set up like:

String          EN                  FR
========================================================
TEST-001        This is a Test1     FR:This is a Test1
TEST-002        This is a Test2     FR:This is a Test2
TEST-003        This is a Test3     FR:This is a Test3

I've looked through the Internationalizing UI Strings article (https://docs.adobe.com/docs/en/aem/6-2/develop/components/i18n/i18n-dev.html) but when I try to the following:

Granite.I18n.setLocale("en");
Granite.I18n.get("TEST-001");

or

Granite.I18n.setLocale("fr");
Granite.I18n.get("TEST-001");

I only get returned the string I've passed in (i.e. "TEST-001").

Could someone help me understand how to retrieve the translated value back?

Thanks!

Upvotes: 1

Views: 5935

Answers (1)

Ameesh Trikha
Ameesh Trikha

Reputation: 1712

Depends on where your translations are stored, you could try something like - 

<script>
        Granite.I18n.init({
            locale: "<%= LocaleUtil.toRFC4646(request.getLocale()).toLowerCase() %>",
            urlPrefix: "<%= request.getContextPath() %>/libs/cq/i18n/dict."
        });
    </script>

This is a sample taken from here - 

/libs/cq/gui/components/projects/admin/page/head.jsp

Other way is 

<html
    lang="<%= LocaleUtil.toRFC4646(request.getLocale()).toLowerCase() %>"
    data-i18n-dictionary-src="<%= request.getContextPath() %>/libs/cq/i18n/dict.{+locale}.json">

taken from - /libs/fd/fm/gui/components/admin/creationwizard/page/page.jsp

Upvotes: 1

Related Questions