Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Bug - Datepicker - Chrome - Months displayed in wrong format #4545

Closed
agpreynolds opened this issue May 14, 2017 · 4 comments
Closed

Bug - Datepicker - Chrome - Months displayed in wrong format #4545

agpreynolds opened this issue May 14, 2017 · 4 comments
Assignees

Comments

@agpreynolds
Copy link

Bug

Default locale settings in chrome cause the datepicker to display months in an incorrect format
I suspect a default locale setting needs to be added in the date adapter

What is the expected behavior?

Months should be displayed e.g. 'May 2017'
image

What is the current behavior?

Months are displayed e.g. '2017 M05'
image

What are the steps to reproduce?

View the demo in chrome
https://material.angular.io/components/component/datepicker

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

Material beta5
OS: Ubuntu 17.04, Android (haven't tested on other OS's)
Browser: Chrome

@fxck
Copy link
Contributor

fxck commented May 15, 2017

You'll be able to set local yourself after this is merged in #4541 as long as it's one of MM-DD-YYYY locales, native adapter doesn't work properly with other formats #4358

@tmakin
Copy link

tmakin commented May 16, 2017

I just ran into this and fixed it by setting the locale explicitly in the app module.

export class AppModule {
  constructor(private dateAdapter:DateAdapter<Date>) {
    dateAdapter.setLocale('en-gb');
  }
}

And whilst debugging I found it useful to run these snippets in the chrome console to see what the Intl API was spitting out:

var dtf = new Intl.DateTimeFormat(undefined, {month: 'short'});
console.debug(dtf.format(new Date(2017,1,1)));

var dtf_gb = new Intl.DateTimeFormat('en-gb', {month: 'short'});
console.debug(dtf_gb.format(new Date(2017,1,1)));

See NativeDateAdaptor for more info. https://github.com/angular/material2/blob/master/src/lib/core/datetime/native-date-adapter.ts

@mmalerba
Copy link
Contributor

Looks like this has been resolved. I'll just add that we do have a bug tracking some work to make NativeDateAdapter work with more locales: #6030

@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 6, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants