CODEWITHSUNDEEP
angularjsangularjs-directive
Redplane
Redplane

Reputation: 3151

Translate object inside controller

I'm new to angularjs. I'm making an application which uses angularjs and Ng tags input.

Everything is fine, but I can't translate the source which is bound to ng tags input.

Here is my code :

<tags-input ng-model="tags"
            add-on-paste="true">
   <auto-complete source="Fruits"></auto-complete>
</tags-input>

And in my controller, I have :

var app = angular.module('at', ['pascalprecht.translate']);

app.config(function ($translateProvider) {
$translateProvider.translations('en', {
     PINE_APPLE: 'Pine apple',
     LEMON : 'Lemon',
     TOMATO: 'Tomato'
});

$translateProvider.preferredLanguage('en');
});

app.controller('Ctrl', function ($scope, $translate) {
$scope.Fruits = [
{
    text: 'TOMATO',
    value: 1
},
{
    text: 'PINE_APPLE',
    value: 2
},  
{
    text: 'LEMON',
    value: 3
}];

$scope.changeLanguage = function (key) {
   $translate.use(key);
   };
});

My question is : how can I translate my Fruits inside Ctrl controller to bind to ng tags input ?

Can anyone help me please ? Thank you.

Upvotes: 1

Views: 6919

Answers (2)

luisvi
luisvi

Reputation: 46

To translate the texts into a JSON object , you could try to translate the texts and then create the object with these translated texts.

var app = angular.module('at', ['pascalprecht.translate']);

app.config(function ($translateProvider) {
$translateProvider.translations('en', {
     TOMATO: 'Tomato'
});

$translateProvider.preferredLanguage('en');
});

app.controller('Ctrl', function ($scope, $translate) {

var TEXT_TRANSLATED = $translate.instant('TOMATO'); //NEW LINE

$scope.Fruits = [
{
    text: TEXT_TRANSLATED,
    value: 1
}
];

I hope you find it useful!

Upvotes: 3

Redplane
Redplane

Reputation: 3151

Thank you , juvian Finally, I tried to apply custom template of ng-tag input as you said, and it worked with dynamic translation.

Upvotes: 0

Related Questions