Angular 4 - material 2 - md datepicker set first day of the week

风格不统一 提交于 2019-12-05 00:20:56
Béla Olcsán

Found a workaround:

Write this class

import {NativeDateAdapter} from '@angular/material';
import {Injectable} from '@angular/core';

@Injectable()
export class MyDateAdapter extends NativeDateAdapter {

  getFirstDayOfWeek(): number {
    return 1;
  }

}

Then import to the app.module like:

{provide: DateAdapter, useClass: MyDateAdapter},

Pretty much the sam answer as Béla but I had to implement the constructor to get it working.

import { NativeDateAdapter } from '@angular/material';
import { Injectable } from '@angular/core';
import { Platform } from '@angular/cdk/platform';

@Injectable()
export class SwedishDateAdapter extends NativeDateAdapter {
  constructor() {
    super('sv-SE', new Platform());
  }

  getFirstDayOfWeek(): number {
    return 1;
  }
}
constructor(
    private dateAdapter: DateAdapter<Date>
  ) { }

  ngOnInit() {
    this.dateAdapter.setLocale('es');
    this.dateAdapter.getFirstDayOfWeek = () => { return 1; }
  }

Simply add the following to you app.module.ts:

  providers: [
    { provide: LOCALE_ID, useValue: 'en-GB' }
  ],

I'm currently using angular 6 with the corresponding version of the material.

The solutions above worked however since i was using the moment.js adapter the application stopped working correctly.

Using the code at https://github.com/angular/material2/blob/master/src/material-moment-adapter/adapter/moment-date-adapter.ts and injecting it into the module made the application detect the correct region and set the starting day to monday (mine was pt-pt).

The only change needed was to set the correct moment import.

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!