aureliaでJQuery UI datepickerを使用してロケールを変更する方法は？

Question

以下は、jquery UIからjquery datepickerとi18nが含まれ、カスタム属性が作成されたコードです。 datepickerは動作してカレンダーを表示しますが、ロケールをフランス語に変更しません。 jquery UI i18nフォルダからロケールファイルを含めなければならない方法はありますか？

import $ from "jquery"; 
 
import {datepicker} from "components-jqueryui"; 
 
import {EventAggregator} from "aurelia-event-aggregator"; 
 
import {inject, customAttribute} from "aurelia-framework"; 
 
import {i18n} from "components-jqueryui"; 
 

 

 
@customAttribute("datepicker") 
 

 
@inject(Element, EventAggregator) 
 
export class DatePicker { 
 
    constructor(element, eventAggregator) { 
 
     this.element = element; 
 

 
     // Handle to Aurelia pub/sub events 
 
     this.eventAggregator = eventAggregator; 
 
    } 
 

 
    attached() { 
 
     $(this.element).datepicker($.datepicker.regional["fr"]); 
 
     // $.datepicker.setDefaults(
 
     //  $.extend($.datepicker.regional["fr"]) 
 
     //); 
 
     $(this.element).datepicker({dateFormat: "yy-mm-dd", onClose: function fct() { this.focus(); }}) 
 
      .on("change", e => fireEvent(e.target, "input")); 
 

 
     this.eventAggregator.subscribe("event:locale:changed", (locale) => { 
 
      $(this.element).datepicker($.datepicker.regional["fr"]); 
 
      // $.datepicker.setDefaults(
 
      //  $.extend($.datepicker.regional["fr"]) 
 
      //); 
 
     }); 
 
    } 
 

 
    detached() { 
 
     $(this.element).datepicker("destroy") 
 
      .off("change"); 
 
    } 
 
} 
 

 
function createEvent(name) { 
 
    let event = document.createEvent("Event"); 
 

 
    event.initEvent(name, true, true); 
 
    return event; 
 
} 
 

 
function fireEvent(element, name) { 
 
    let event = createEvent(name); 
 

 
    element.dispatchEvent(event); 
 
}

Answer 1

インポート*。

ロケールを次のように設定します。 $（this.element）.datepicker（$。datepicker.regional [locale]）;

Answer 2

$.datepickerのようなもの、ロケールを変更するための別のインターフェイスを持っています

$(this.element).datepicker('options', 'new-locale'); 

はまた、あなたが対応するローカライズスクリプトをインポートする必要があります。

<script src="i18n/datepicker-fr.js"></script> 

...またはs何か同等のES6インポート。 import {i18n} from "components-jqueryui";がこの2番目の部分を実行する可能性があります。ここで

フル例： "コンポーネント-jqueryui/UI/I18N /日付ピッカー-FRCA" からFRCAとして

https://jqueryui.com/datepicker/#localization