we would like to use the task list with embedded forms and i18n.
One possibility is to extend the existing locales via camunda-webapp / maven overlay mechanism.
But the camunda-webapp is a central application and process independent and we would’n like to mix it up.
What is the easiest way to use own translation files for each process deployed?
We think about using angular-translate with asynchronous loading of needed json translation files.
As camunda-webapp is using angular-translate, we could use same mechanism. Or is it limited in context of embedded forms somehow?
Did someone already tried it?
Also alternative solutions are welcome. Let’s discuss
That looks like angular does not parse the expression at all. Do you have any errors in the browser console? Does it work if you replace the content in the curly braces with a simpler angular expression (e.g. {{ 1 + 2 }} should render 3 in the form)?
Hi @ll! Thanks for your answers. Using the i18n values from tasklist in embedded forms works well. It’s also possible to add new key/value pairs to this central camunda webapp. But we don’t want to mix up the values from different processes in one file. We’d like to seperate them and deploy in each war inside the process.
Did someone managed it to extend the translations of the tasklist when a specific embedded form is loaded?
Alternatively we can use an own client-side i18n solution loaded up when the embedded form is loaded.
It supports a per process/form translation (https://help.form.io/developer/info/#form-translation) (either stored on Formio server or directly in the war). We like the idea of storing it on the formio side so forms can be reused across processes; but still prototyping.
The Tasklist uses angular-translate for i18n. I don’t know if you can add keys after initialization, but you can have a look at the angular-translate documentation and try it out
Hallo @sebastian.stamm
This is the way I am also trying to go.
It’s possible to use async loader for translations. Is it possible to configure the angular app-context during load of embedded forms? And also inject the $translateProfider?
From angular-translate documentation:
angular.module(‘app’).config(function ($translateProvider) { … }
To set an async-loader we need to configure the $translateProvider during angular’s configuration phase. Is it possible within an embedded form?
As embedded forms are only loaded when the task is selected, it is not possible to execute scripts that need to be run in angulars configuration phase.
You could of course re-create the logic yourself within the embedded form, i.e. making an ajax request to load the translation file and then apply the result to the form content.
Hello @pagluc @sebastian.stamm is right, you cannot execute this script mentioned by you.
Just to give you an idea how you could manage to build your custom logic:
<script cam-script type="text/form-script"> inject([ '$scope', '$translate', function($scope, $translate) { $scope.translation = {}; var currentLang = $translate.proposedLanguage() || $translate.use(); //this json could also come from different files and could be loaded by an ajax request as Sebastian mentioned var json = { en: { "TITLE":"englisch" }, de: { "TITLE":"deutschh" } }; $scope.translation = json[currentLang]; }]); </script>
Within your form you could then use: <p>{{ translation.TITLE }}</p>
Hello @felix-mueller
thank you for your answer and a possible solution.
For us it will be sufficient for now.
We have a bootscript for all embedded forms, there we will load up additional json-file with translations…
