[Solved] Angular Translate in Widget Options

[Christian]

Hi,

Can you give me some advice on how to use angular translate inside of widget configurations?

Because ng-translate works async it seems ugly wrapper code is necessary like the one below.

 

Only the grid widget seems to support direct usage of translate like this:

...
                "columns": [
                    {
                        "title": "{{'Tenant.Users.UserTab.FirstName' | translate}}",
                        "field": "FirstName",
...

I couldn't get it working with other widgets. Am I missing an important detail?

 

$translate(['Core.Buttons.Ok', 'Core.Buttons.Cancel']).then(function(t) {
                $scope.colorOptions = {
                    buttons: true,
                    preview: true,
                    input: true,
                    messages: {
                        apply: t['Core.Buttons.Ok'],
                        cancel: t['Core.Buttons.Cancel']
                    }
                }
            });

 

<input kendo-color-picker ng-model="color1" k-options="colorOptions" />

[Stefan]

Hello Christian,

I can suggest checking our code library demonstrating how to use Kendo Globalization and Localization with angular-translate. The code library is demonstrating how this can be achieved for the Grid, the Calendar and the DropDownList:

http://www.telerik.com/support/code-library/kendo-globalization-localization-with-angular-translate

We do not have a direct built-in support for Angular translate, we only made a demonstration how this can be achieved.

Regards,
Stefan
Telerik by Progress