3

I have an app in AngularJS where I'm using Fullcalendar comnbined Angular ui-calendar with to show the user's events. This works great!

In the app, a user can also change between two languages, danish and english.

This is where my problem start, because when I click the button and change the language, the hole calendar just disappears - all the content inside <div ui-calendar="uiConfig.calendar" ng-model="eventSources"> gets removed for some reason.

Calendar before language change Calendar after language change

Controller

This is taken from their GitHub demo (Changed from hungarian to danish).

$scope.changeTo = 'Danish';
$scope.changeLang = function() {
    if($scope.changeTo === 'Danish'){
        $scope.uiConfig.calendar.dayNames = ["Søndag", "Mandag", "Tirsdag", "Onsdag", "Torsdag", "Fredag", "Lørdag"];
        $scope.uiConfig.calendar.dayNamesShort = ["Søn", "Man", "Tirs", "Ons", "Tors", "Fre", "Lør"];
        $scope.changeTo= 'English';
    } else {
        $scope.uiConfig.calendar.dayNames = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
        $scope.uiConfig.calendar.dayNamesShort = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
        $scope.changeTo = 'Danish';
    }
};

Besides that, the language which the monthName and dayName are always in danish, even if i specifically set the lang option to en, in the calendar config object.

config object

$scope.uiConfig = {
    calendar:{
        lang: 'en',
        header:{
            left: 'prevYear prev',
            center: 'title',
            right: 'next nextYear'
        },
        firstDay: 1,
        selectable: true,
        timeFormat:'HH:mm', // Month 24 hour timeformat
        axisFormat: 'HH:mm', // Week & Day 24 hour timeformat
        weekNumbers: true,
        nextDayThreshold: '00:00:00'
    }
};

I've tried to load the all-lang.js and also the files indidually for each necessary language (en-ca.js & da.js), but without any luck.

Is there somebody that have experienced the same, or have an idea of what might be causing this?

Backer
  • 1,094
  • 1
  • 20
  • 33
  • How are you doing the translation in app? with angular-translate or some custom script..? I don't see a `lang` option in the documentation of your calendar plugin. Does it support language transition..? Could you create a [mcve]..? – T J Mar 09 '16 at 11:44
  • @ T J: I'm using angular-translate to translate the rest of the app. And the `lang` option is from jQuery Fullcalendar - http://fullcalendar.io/docs/text/lang/ – Backer Mar 09 '16 at 11:56

0 Answers0