angular / angular/components

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

Aperta
#12,891 9 commenti 9 reazioni 0 assegnatari Vedi su GitHub
area: material/datepicker P3
Lingua principale
TypeScript
Stelle
25k
Fork
6.8k
Merge medio
1g 8h
PR unite (30g)
91

Descrizione

#### 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)

Guida per i contributori

Apri la guida per i contributori

Direzione di ricerca

Inizia con la riproduzione StackBlitz, in particolare app.component.ts, app.module, lazy.module e gli import di SharedModule. Traccia come viene fornito DateAdapter nei moduli principale e lazy-loaded, quindi verifica che l’impostazione della locale nell’applicazione influisca sui datepicker in entrambe le route. Il lavoro è completato quando la riproduzione si comporta in modo coerente oppure il comportamento è documentato chiaramente.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Valutazione

Stack tecnologico
angular, typescript
Ambito
frontend, localization
Tipo di issue
Bug
Difficoltà
4/5
Tempo stimato
3-5 giorni
Stato di attività
Ferma
Chiarezza
Abbastanza chiara
Idoneità per principianti
35/100

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.