EzDevInfo.com

gettext module in angularjs does does not translate gettextCatalog.getString() in controller

Im using gettext module for angular to handle my translations. This works almost perfectn. gettext

Now i have 2 controllers. 1 is called basecontroller other controllers are per view. so the base controller is attached to the html tag and using ngRoutes i attach a diffrent controller to each view.

Now in the base controller i set language like this:

    //set lang
$rootScope.selectedLang = 'NL';

//Switch language
$scope.setLang = function(type,lang) {
    if (type == 'select') {
        ngDialog.open({
            template: 'views/popups/set-language.php',
            className: 'ngdialog-theme-flat',
            controller: 'BaseCtrl'
        });
    }

    if (type == 'set') {
        if (lang == 'nl') {
            gettextCatalog.setCurrentLanguage('nl');
            $rootScope.selectedLang = 'NL';
        }

        if (lang == 'en') {
            gettextCatalog.setCurrentLanguage('en');
            $rootScope.selectedLang = 'EN';
        }
        ngDialog.closeAll();
    }
}

this works fine. When user clicks on NL its translates to NL and when user clicks on EN it translates texts to eng.

The problem is that per controler I also have strings. these are in javascript so in searchcontroller for example i have:

    $rootScope.stepText = gettextCatalog.getString("step_1_header");

these translations are for global things like a header title, that changes per controller.

This also works fine but now the problem is the switch. When i switch to english all texts get translated but not the $rootScope.stepText = gettextCatalog.getString("step_1_header");

I think this is because i do the switch in the base controller. Does anyone have any idea to fix this ?

Handling grammatical gender with Angular-Gettext

I'm looking for a simple-proper-elegant way to handle grammatical gender with Angular-Gettext. Is it possible to do something with the translate-plural directive or by using ng-pluralize ?

Angular translate decimal numbers

I am using angular-gettext for a project. I was wondering if somehow I could translate decimal numbers. FX in some languages you write 2.5 and some other 2,5. Do you have any idea if this is doable via the angular-gettext?

What other workaround could there be?

How to use angular-gettext in a config phase?

I'm using angular-gettext, angular-breadcrumb and angular-ui-router.

I have my app configuration similar to this:

app.config(function($stateProvider) {

  $stateProvider.state('welcome', {
     url : '/',
     templateUrl: 'index.html',
     ncyBreadcrumb : {
        label : 'Home'
     }
  });

});

I would like to be able to translate the label for the breadcrumb ('Home') by angular-gettext. In order to this I need to include gettext tools into the app.config() function. Something like this would be ideal, however gettextCatalog isn't available during the config phase:

app.config(function($stateProvider, gettextCatalog) {

  $stateProvider.state('welcome', {
     url : '/',
     templateUrl: 'index.html',
     ncyBreadcrumb : {
        label : gettextCatalog.getString('Home')
     }
  });

});

Is there any other way to achieve this with these plugins, especially with the angular-gettext?

angularjs: gettext not working in ngSwitch

I'm trying to use gettext in combination with ngSwithc, as follows:

<ANY ng-switch="expression">
  <ANY ng-switch-when="matchValue1" translate>...</ANY>
  <ANY ng-switch-when="matchValue2" translate>...</ANY>
  <ANY ng-switch-default translate>...</ANY>
</ANY>

Here is a jsfiddle demonstrating the issue. The error I get is

Error: [$compile:multidir] Multiple directives [ngSwitchWhen, translate] asking for transclusion on: <div ng-switch-when="opt0" translate="">

Any suggestion how I can use gettext in combination with ngSwitch ?

Protractor: getText() doesn't work [Unable to get text from Span in header]

AngularJS: Alert Popup

<div class="modal-header">
<h3>
<span class="firefinder-match" data-ng-show="dialog.stopOrService === 'STOP'" data-translate-values="{"days":"ALL_DAYS","time":"2015-06-20T08:39:46.654Z","stopOrService":"STOP","stopName":"Fairbairn Av after War Memorial Service [3473]","serviceList":[{"serviceNumber":"910","id":"6350571294206984726","name":"910 City via Majura Business Park(Net14NoAir"}],"selectedService":null,"receiveSituations":false,"processing":false}" data-translate="liveDepartures.alerts.addModal.stopHeader">Add a regular alert for upcoming buses at Fairbairn Av after War Memorial Service [3473]</span>
<span class="firefinder-match ng-hide" data-ng-show="dialog.stopOrService === 'SERVICE'" data-translate-values="{"days":"ALL_DAYS","time":"2015-06-20T08:39:46.654Z","stopOrService":"STOP","stopName":"Fairbairn Av after War Memorial Service [3473]","serviceList":[{"serviceNumber":"910","id":"6350571294206984726","name":"910 City via Majura Business Park(Net14NoAir"}],"selectedService":null,"receiveSituations":false,"processing":false}" data-translate="liveDepartures.alerts.addModal.serviceHeader">Add a regular alert for route </span>
</h3>
</div>

Assertion: Using getText()

        var pageHeader = element(by.css('.modal-header > h3 > span'))
        expect(pageHeader.getText()).toContain('Add a regular alert');
        pageHeader.getText().then(function(text){
            console.log("++++++++++++++++++++++++++++++++++++++" +text);

        });

Problem: Not able to get text from element I have tried a number of ways to identify the 'Text' on model header but could not succeed in getting the text from the element. The problem looks like the element is not getting identified. Can someone please help me to resolve this issue.

angular-gettext : change language dynamically?

I have used angular gettext in my app. I have two languages as of now and want to switch the language in the UI depending on users preferences. I have a button for two languages- DE and EN.

In the controller method i have set the language:

      $scope.changeLang = function (lang) {
                    gettextCatalog.currentLanguage = lang;
                    gettextCatalog.debug = true;

};

On doing this the language doesn't seem to change in the UI. What is the right way to change the language dynamically in UI using angular gettext?

Thanks in advance.

nggettext_compile does not extract any strings from my .PO file

I have a file po/el.po containing translations:

msgid ""
msgstr ""
"Project-Id-Version: \n"
"PO-Revision-Date: 2015-07-01 10:49+0000\n"
"Language: el\n"
"Content-Type: text/plain; charset=UTF-8\n"
"Content-Transfer-Encoding: 8bit\n"
"Plural-Forms: nplurals=2; plural=n != 1;\n"
"X-Generator: Weblate 2.2\n"

#: static/src/partials/layout/header.html:17
#, fuzzy
msgid "About"
msgstr "σχετικά με"

#: static/src/partials/layout/header.html:19
#, fuzzy
msgid "Admin"
msgstr "διαχειριστής"

[[SNIP]]

I've taken the Gruntfile config straight from the documentation.

nggettext_compile: {
        all: {
                  files: {
                        'static/src/js/app/translations.js': [
                                'po/*.po'
                        ]
                }
        }
}

grunt --verbose shows that it finds po/el.po, and creates static/src/js/app/translations.js

Running "nggettext_compile:all" (nggettext_compile) task
Verifying property nggettext_compile.all exists in config...OK
Files: po/el.po -> static/src/js/app/translations.js
Options: (none)
Reading po/el.po...OK
Writing static/src/js/app/translations.js...OK

Done, without errors.

However, the resulting static/src/js/app/translations.js contains an empty list of translations:

angular.module('gettext').run(['gettextCatalog', function (gettextCatalog) {
/* jshint -W100 */
    gettextCatalog.setStrings('el', {});
/* jshint +W100 */
}]);

What am I missing?

angularjs/gettext: how to translate text in attributes

I have a piece of html like this

<bar title="'My Title'"></bar>

Now, when I want to translate it, it looks like this

<bar title="'My Title'|translate"></bar>

The reason why I dont have {{ and }} is because the 'bar' directive binds the title to its scope with '='

scope: {
    title: '=',
    ...
}

The problem is that the task 'nggettext_extract' doesn't extract this text, because it is looking for things in between curly brackets. I found a hack to solve this problem:

<bar dummy="{{My Title'|translate}}" title="'My Title'|translate"></bar>

But I hope there is a better solution to this problem ?

UPDATE: The workaround I've implemented now is that I changed the directive as follows

scope: true,
link: function(scope, element, attrs) {
    scope.title = attrs.title;
}

Of course, if someone knows a better solution please let me know!