angular / angular/components

DateAdapter: issues with setLocale(..) in main vs. lazy loaded module

Ouverte
#12,891 9 commentaires 9 réactions 0 personnes assignées Voir sur GitHub
area: material/datepicker P3
Langage dominant
TypeScript
Étoiles
25k
Forks
6.8k
Merge moyen
1 j 8 h
PR mergées (30 j)
91

Description

#### Bug, feature request, or proposal:

Bug (probably, otherwise docs need to be updated to clarify this behavior).

#### What is the expected behavior?

I expect the entire application to be in a certain locale, thus it should be enough to set it **once** using the DateAdapter's `setLocale(..)`.

#### What is the current behavior?

Apparently the `DateAdapter` is not a single instance, but rather lazy modules get their own instance. As a result, setting the locale (like in the `app.component.ts` might not work (as one expects) when loading some components within a lazy loaded module (via routing).

#### What are the steps to reproduce?

Here's a Stackblitz to reproduce the issue: https://stackblitz.com/edit/angular-material-datepicker-locale?file=src%2Fapp%2Fapp.component.ts

1. Clicking the "test" link loads the lazy `/test` route. Both, `app.module` and `lazy.module` import `SharedModule` which imports the Material stuff.
1. The datepicker is in English by default. Clicking the button "set locale on app module" should set it to German, but it doesn't.
1. Clicking the button "set locale in lazy module" however works as expected.

That makes me think there are 2 instances of the `DateAdapter`, one for the lazy module and one for the app module.

#### What is the use-case or motivation for changing an existing behavior?

Usually the locale is very much related to the application language. In most cases you load the user profile when the app starts and based on his settings, cookies or whatever, you set the language and locale respectively. Similarly at the same point you also want to adjust other components' locales such as the Material Datepicker.

The current behavior however is misleading, as one might expect that setting the locale on the `DateAdapter` object should automatically adjust them for all datepickers. Due to the bug that is not the case for lazy loaded modules however.

#### Which versions of Angular, Material, OS, TypeScript, browsers are affected?

![image](https://user-images.githubusercontent.com/542458/44794731-61986480-aba9-11e8-8c04-c77015e4062a.png)

Guide de contribution

Ouvrir le guide de contribution

Piste de recherche

Commencez par la reproduction StackBlitz, en particulier app.component.ts, app.module, lazy.module et les imports de SharedModule. Suivez la manière dont DateAdapter est fourni dans les modules principal et chargé paresseusement, puis vérifiez que la définition de la locale dans l’application affecte les datepickers dans les deux routes. Le travail est terminé lorsque la reproduction se comporte de manière cohérente ou que le comportement est clairement documenté.

Rédigé par le modèle d'indexation à partir du texte de l'issue.

Évaluation

Stack technique
angular, typescript
Domaine
frontend, localization
Type d'issue
Bug
Difficulté
4/5
Temps estimé
3-5 jours
Activité
À l'abandon
Clarté
Plutôt claire
Accessibilité débutants
35/100

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.