Question

我尝试按照Angular Material网站上的官方文档： https://material.angular.io/components/datepicker/overview

我想将datepicker的语言更改为希伯来语，并将格式更改为dd / mm / yyyy。

这是我的component.html：

<md-form-field class="full-width">
    <input
        (click)="picker.open()"
        [min]="minDate"
        [max]="maxDate"
        mdInput
        readonly
        [mdDatepicker]="picker"
        formControlName="date"
        placeholder="Choose Date">
    <md-datepicker-toggle mdSuffix [for]="picker"></md-datepicker-toggle>
    <md-datepicker touchUi="true" #picker></md-datepicker>
</md-form-field>

我尝试过能够通过在component.ts文件中设置以下设置将语言更改为希伯来语：

constructor(
    dateAdapter: DateAdapter<NativeDateAdapter>,
    ...
 ) {
    dateAdapter.setLocale('he-HE');
 }

现在语言改变了（月份名称等），格式改为d / m / yyyy

问题在于，当用户选择例如1.7.17时，这意味着他选择1，2017年9月，如果用户再次点击日期选择器，则会向他显示1月的日历。

谢谢你的帮助

Answer 1

你必须实现解析。我使用moment.js库，这是我的impl：

    @Injectable()
    export class MyDateAdapterService extends NativeDateAdapter {

      parse(value: any): Date | null {
        if (typeof value === 'number') {
          return new Date(value);
        }

        if (value) {
          const localeData = moment.localeData();
          const format = localeData.longDateFormat('L');
          return moment(value, format).toDate();
        } else {
          return null;
        }
      }
    }

您还需要更改语言环境，例如：

   moment.locale('fr');

并添加您的提供商：

providers: [
  [{provide: DateAdapter, useClass: MyDateAdapterService}]
]

Angular 2 Material datepicker - 更改格式和语言

1 个答案: