angular/components

Add docs example of custom timezone with MomentDateAdapter

Open

#8482 opened on Nov 16, 2017

View on GitHub
 (7 comments) (4 reactions) (0 assignees)TypeScript (24,044 stars) (6,650 forks)batch import
P5area: docsarea: material/datepickerhelp wanted

Description

Bug, feature request, or proposal:

[X] Feature Request

What is the expected behavior?

MomentDateAdapter should have timezone support. Moment has a timezone lib (http://momentjs.com/timezone/) which you can set the timezone manually. This is needed when you want to create a common date/datetime based in a specific timezone.

What is the current behavior?

MomentDateAdapter supports browser's timezone only when creating a new date moment object.

What are the steps to reproduce?

  • Include MatMomentDateModule to use MomentDateAdapter
  • Create a mat-datepicker
  • Console the output (date generated)

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

I do want to create a common date/datetime based in a specific timezone.

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

Angular CLI: 1.5.0 Node: 8.8.1 OS: darwin x64 Angular: 5.0.1 ... animations, common, compiler, compiler-cli, core, forms ... http, platform-browser, platform-browser-dynamic ... platform-server, router

@angular/cdk: 5.0.0-rc0 @angular/cli: 1.5.0 @angular/flex-layout: 2.0.0-beta.10-4905443 @angular/material-moment-adapter: 5.0.0-rc0 @angular/material: 5.0.0-rc0 @angular-devkit/build-optimizer: 0.0.32 @angular-devkit/core: 0.0.20 @angular-devkit/schematics: 0.0.34 @ngtools/json-schema: 1.1.0 @ngtools/webpack: 1.8.0 @schematics/angular: 0.1.2 typescript: 2.4.2 webpack-sources: 1.0.1 webpack: 3.8.1

Contributor guide

Tech stack
typescriptjavascript
Domain
frontenddocumentation
Issue type
feature
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
3
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
half day
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
stale
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
mostly clear
Prerequisites
Angular MaterialMoment.jsTimezone concept
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
60
Research direction
Examine the current MomentDateAdapter implementation in the Angular Material repository. Look into the Moment.js timezone library documentation. Review any previous comments on this issue for suggested approaches. Propose a documentation example that shows how to set a custom timezone when creating a date.