Search code examples
angularjsangular-translate

angular-translate not working on templates

I'm trying to make use of angular-translate for localization, but I'm having an issue where it only works on the home page. After clicking on a link, the next page isn't translated at all.

The weird thing is that the navbar translations(located on index.html) still translate properly, but the content in the ngview isn't translated. The controller for the other page is currently empty.

enter image description here

-App.js
var myApp = angular.module('myApp', ['ngRoute', 'pascalprecht.translate']);

myApp.config(
function ($routeProvider) {
    $routeProvider.
  when('/signup', {
        templateUrl: 'partials/signup.html',
        controller: 'SignUpControllers'
    }).
  otherwise({
        templateUrl: 'partials/home.html'
    });
})
.config(function ($translateProvider) {
$translateProvider.useStaticFilesLoader({
    prefix: '/languages/',
    suffix: '.json'
});
$translateProvider.preferredLanguage('en');
});

Another thing I noticed is that the default page content on home.html IS translated properly, but any other page doesn't get translated properly.

Plunker Example - example works correctly

Solution

  • You have an error in your set up which is preventing the route that is not being translated from loading correctly. From your plunkr:

    Error: [ng:areq] Argument 'SignUpControllers' is not a function, got undefined

    This would indicate that you haven't set up SignUpControllers properly in your module configuration. Indeed, you haven't actually defined that controller in your plunker.