Angular Dynamic Locale not working instantly

Question

I use angular-dynamic-locale to change the language of UI Bootstrap's datepicker (I do not want to add the right localization source file at the server side. Hence, I need something more dynamic).

The localization file is loaded. However, when I open a datepicker on my page, the localization takes place only after I switch to a new month via the <, > buttons.

Is there any way to have this change happen directly?

Answer 1

Never mind, I actually found a solution which does not involve dynamic localization. As proposed by will Farrrell, I detect the user's locale right in the header of my index.html and load the according locale:

var locale = window.navigator.userLanguage || window.navigator.language;
if (locale) {
    var smallLocale = locale.toLowerCase();
    document.write('<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-i18n/1.2.15/angular-locale_' + smallLocale + '.js"><\/script>');
} 

This works for the datepicker (if dynamic behaviour is not needed).