CODEWITHSUNDEEP
angularjsionic-frameworkangular-translate
Stevie Star
Stevie Star

Reputation: 2371

Reload angular-translate-static-loader-files within app, without refresh in Ionic

I'm working on this Ionic app and I'm using angular-translate-loader-static-files with angular-translate to load in a bunch of language .json files.

Everything is working fine, but I'm trying to figure out how to basically "re-run the $translateProvider" so it can reload all the static files all over again as the .json files will get updated from the server periodically. I have yet to figure this out, and even trying to force a "page reload" doesn't cause the static files to reload.

I should note that I'm currently testing this in iOS and I realize that the directory structure will change, based on OS.

Here is my service that utilizes $cordovaFile to overwrite the file with new text. Right now I'm just using a simple json string to make sure I can solve the problem:

(function() {
  'use-strict';
  angular.module('coursemill.services')
    .service('Translations', Translations);

  /**
   *  Service: Check network connection
   */
  function Translations($cordovaFile) {

    function updateLanguageFile(lang) {
      document.addEventListener("deviceready", function() {
        $cordovaFile.checkFile(cordova.file.applicationDirectory + "/www/languages/", lang + ".json")
        .then(function (success) {

          // Update the language file
          $cordovaFile.writeFile(cordova.file.applicationDirectory + "/www/languages/", lang + ".json", '{"COURSES_MENU_REQUIRED": "Required"}', true)
          .then(function (success) {
            // TO-DO: reload translation files
          },
          function (error) {});
        },
        function (error) {});
      });
    }

    return {
      updateLanguageFile: updateLanguageFile
    }
  }
})();

Here is a snippet from my .config:

// Setup the language translations
  $translateProvider.useStaticFilesLoader({
    prefix: 'languages/',
    suffix: '.json'
  });

Here is a snippet from my controller:

Translations.updateLanguageFile('en_US');

When I open the file up after this function has been run, the contents of the file are replaced and are doing exactly what I want, but I'd like my language variables inside the app to be updated as well, and they aren't.

Any thoughts on what can be done here?

Upvotes: 1

Views: 1432

Answers (1)

Stevie Star
Stevie Star

Reputation: 2371

Doink, I needed to use $translate.refresh() in my service function. So now it looks like this:

(function() {
  'use-strict';
  angular.module('coursemill.services')
    .service('Translations', Translations);

  function Translations($cordovaFile, $translate) {

    function updateLanguageFile(lang) {
      document.addEventListener("deviceready", function() {
        $cordovaFile.checkFile(cordova.file.applicationDirectory + "/www/languages/", lang + ".json")
        .then(function (success) {

          // Update the language file
          $cordovaFile.writeFile(cordova.file.applicationDirectory + "/www/languages/", lang + ".json", '{"COURSES_MENU_REQUIRED": "Required"}', true)
          .then(function (success) {
            // Reload translation files
            $translate.refresh();
          },
          function (error) {});
        },
        function (error) {});
      });
    }

    return {
      updateLanguageFile: updateLanguageFile
    }
  }
})();

Upvotes: 1

Related Questions