Angular-gettext doesn't update strings generated in code

Question

When I set language like this gettextCatalog.setCurrentLanguage(langString); it doesn't work to my side-nav menu. My side menu can be in one of two states: expanded or collapsed, so I use ng-include for side menu and change it when switching states.

When I use setCurrentLanguage, strings inside menu don't change. It will be changed only after page reloading (I keep current language in localStorage). So, setCurrentLanguage could be applied on app startup to my side menu, but it doesn't work dynamically.

Edit:

Probably it is connected with that fact that I generate menu item's names using gettextCatalog.getString('somestring'), so, names will be created with correct languages at startup, but I can't update them when changing languages, because the result of `gettextCatalog.getString('somestring') is just stored in variable now. So, no angular watchers there anymore.

So, how to update strings that created from code?

Answer 1

Don't use gettextCatalog.getString(), use gettext() instead:

$scope.myVar = gettext("Something");

And in your view, use the translate filter:

{{ myVar | translate}}

This will correctly update when you change the language.

More info here: https://angular-gettext.rocketeer.be/dev-guide/annotate-js/