day incorrect in angular material datepicker

Two days ago, at https://github.com/angular/material2/issues/7167, Silthus posted his workaround that overrides the MomentJsDataAdapter. I tried it and it worked as a charm from anywhere in the globe.

First he added a MomentUtcDateAdapter that extends MomentDateAdapter

import { Inject, Injectable, Optional } from '@angular/core';import { MAT_DATE_LOCALE } from '@angular/material';   import { MomentDateAdapter } from '@angular/material-moment-adapter';import { Moment } from 'moment';import * as moment from 'moment';@Injectable()export class MomentUtcDateAdapter extends MomentDateAdapter {  constructor(@Optional() @Inject(MAT_DATE_LOCALE) dateLocale: string) {    super(dateLocale);  }  createDate(year: number, month: number, date: number): Moment {    // Moment.js will create an invalid date if any of the components are out of bounds, but we    // explicitly check each case so we can throw more descriptive errors.    if (month < 0 || month > 11) {      throw Error(`Invalid month index "${month}". Month index has to be between 0 and 11.`);    }    if (date < 1) {      throw Error(`Invalid date "${date}". Date has to be greater than 0.`);    }    let result = moment.utc({ year, month, date }).locale(this.locale);    // If the result isn't valid, the date must have been out of bounds for this month.    if (!result.isValid()) {      throw Error(`Invalid date "${date}" for month with index "${month}".`);    }    return result;  }}

And then in the AppModule component, you have to do this:

providers: [    ...    { provide: MAT_DATE_LOCALE, useValue: 'en-GB' },    { provide: MAT_DATE_FORMATS, useValue: MAT_MOMENT_DATE_FORMATS },    { provide: DateAdapter, useClass: MomentUtcDateAdapter },    ...],

Just use option useUtc: true for MatMomentDateAdapter:

import { MatMomentDateModule, MAT_MOMENT_DATE_ADAPTER_OPTIONS } from '@angular/material-moment-adapter';@NgModule({  exports: [    MatMomentDateModule,    // ...  ],  providers: [    { provide: MAT_MOMENT_DATE_ADAPTER_OPTIONS, useValue: { useUtc: true } }  ],})export class CustomModule { }

Maybe it will be helpful for someone. It is my example method in which i erase TimeZone OffSet from component date

  addPriceListPeriod(priceListId: number, periodDateFrom: Date) {    let UTCDate = Date.UTC(periodDateFrom.getFullYear(), periodDateFrom.getMonth(), periodDateFrom.getDate()) - periodDateFrom.getTimezoneOffset();    periodDateFrom = new Date(UTCDate);    const tempObject = {      priceListId,      fromDate: periodDateFrom    }    return this.httpClient.post('PriceLists/addPriceListPeriod', tempObject);  }