angular-ui / ui-date

jQuery UI Datepicker for AngularJS
http://angular-ui.github.io/ui-date/
MIT License
266 stars 207 forks source link

How do I change the language of the component? #38

Open ThCC opened 11 years ago

ThCC commented 11 years ago

In my application language change is dynamic, but very frequent. From what I saw in documentation jQueryUI, there are files for each language, but you need to make a javascript command that specifies the language component. The AngularUI did a treatment for this / one specific API?

JQuery Doc: http://api.jqueryui.com/datepicker/ look for Localization

ThCC commented 11 years ago

Good morning, not wanting to be annoying, and forgive me if I'm being, but I really need to know how to modify the language of the ui-date. Can you help me?

ghost commented 10 years ago

Not trivial. I'm assuming you use this angular translate to handle your translations. The way I did it: In index.html, include the languages you want to be able to display:

<script src="js/vendor/i18n/jquery.ui.datepicker-en.js"></script>
<script src="js/vendor/i18n/jquery.ui.datepicker-lb.js"></script>
<script src="js/vendor/i18n/jquery.ui.datepicker-pt-BR.js"></script>
<script src="js/vendor/i18n/jquery.ui.datepicker-tr.js"></script>
<script src="js/vendor/i18n/jquery.ui.datepicker-fr.js"></script>

Then in your controller, extend $scope.dateOptions with the language you're using:

// JQuery UI date options
$scope.dateOptions = {
    minDate: 0,
    dateFormat: ninja_config.l10n.ui_date
};
angular.extend($scope.dateOptions, jQuery.datepicker.regional[$translate.uses()]);

Also add a listener to be able to change the language dynamically:

// Translates the datepicker whenever the language changes.
$scope.$on('$translateChangeSuccess', function () {
    var language = $translate.uses();
    $log.debug('Changing datepicker language to ' + language);
    angular.extend($scope.dateOptions, jQuery.datepicker.regional[language]);
});
zengchuan commented 9 years ago

How to inject jQuery in jQuery.datepicker.regional ?