Question

将语言环境添加到角度组件的指令中：

<input
type="text"
name="date"
mwlFlatpickr
[altInputClass]="'form-control'"
[(ngModel)]="post.date"
[altInput]="true"
[inline]="true"
[dateFormat]="'d.m.y'"
[locale]="'Portuguese'"
[defaultValue]="'today'"
[convertModelValue]="true">

尝试加载语言环境时，返回错误：

错误：flatpickr：葡萄牙语无效的语言环境

在setupLocale（flatpickr.js：1910）在init（flatpickr.js：581）在FlatpickrInstance（flatpickr.js：2419）在_flatpickr（flatpickr.js：2438）在Flatpickr（flatpickr.js：2463）在FlatpickrDirective .push ../ node_modules / angularx-flatpickr / fesm5 / angularx-flatpickr.js.FlatpickrDirective.ngAfterViewInit（angularx-flatpickr.js：295）在callElementProvidersLifecycles（core.js：22416）在callElementProvidersLifecycles（core.js：22390）在在checkAndUpdateView（core.js：23316）的callLifecycleHooksChildrenFirst（core.js：22380）

Answer 1

在您的module.ts文件上，导入所有必需的文件，创建一个名为flatpickrFactory的函数，并导入与您的语言对应的语言（All languages files are here）

import { FlatpickrModule, FLATPICKR } from 'angularx-flatpickr';
import flatpickr from 'flatpickr';
import { Portuguese } from 'flatpickr/dist/l10n/pt';

export function flatpickrFactory() {
  flatpickr.localize(Portuguese);
  return flatpickr;
}

现在，在您的component.ts上将flatpickrFactory();导入到您的ngOnInit()方法中。

ngOnInit() {
  flatpickrFactory();

  // Your other logic here...
}

然后在您的component.html（templateUrl）中，添加指令，如下例所示：

<input 
  type="text" 
  mwlFlatpickr 
  [(ngModel)]="selectedDate" 
  [altInput]="true" 
  [dateFormat]="'d.m.y'"
  [locale]="'Portuguese'"
  [convertModelValue]="true">

使用angularx-flatpickr在Angular上加载语言环境时出错

1 个答案: