时间戳

首页 > 解决方案 > How to localize form builder - formio

angular - How to localize form builder - formio

问题描述

I am implementing a locale for our angular 10 application.
I am using ngx-translate to translate the application content.

We also have user creation forms, where application admins will create a custom form as per their requirements. For this, we are using form.io.
I am using a formio's form-builder which will give the drag and drop components to generate the form, form builder components enter image description here

Whatever components are available those all need to be translated based on application language selection. (Basic, Text Field, Text Area, Display, Data, Validation, etc.) I have gone through the formiojs code and the document Also, I am looking for something exactly like the git issue which already exists, but it does not have enough information which I can start through.

Looking for a guideline that helps me to translate the form-builder components and their properties.

Thank you...

标签： angularinternationalizationi18nextformio

解决方案

I've been through this. Use i18n with formio like this:

var trad_form = JSON.parse(your_json_translation);
Formio.createForm(document.getElementById(id_element),
            your_json_form_structure,
            {
                readOnly: is_read_only,
                language: selected_language,
                i18n: your_json_trad_form
            }).then(function (form) { ... });

And a small part of the json file for the german translation for example would look like this:

var your_json_translation = { "de": { "Number": "Nummer", "Right (Right-aligned)": "Rechts (rechtsbündig)", "Bottom": "Unten", "Placeholder": "Platzhalter", "The placeholder text that will appear when this field is empty.": "Der Platzhaltertext, der angezeigt wird, wenn dieses Feld leer ist.", "Description": "Beschreibung"}};

You have to create that file with all the labels existing in formio.

推荐阅读