問題タブ [flatpickr]

flatpickr カレンダーのインスタンスを使用する HTML があります。私がやりたいことは、付随するスパンがクリックされたときに特定のカレンダー インスタンスのみを開くことです。

付随する Javascript は次のとおりです。

これが現在行うことは、「.datetimepicker input」のすべてのインスタンスを新しいインスタンスとして再初期化することです。開きたいインスタンスを実際に発生させるにはどうすればよいですか?

Flatpickr ( https://chmln.github.io/flatpickr/ ) の onDayCreate イベントに苦労しています。ピッカーの日付オブジェクトが私の日付配列の日付と一致するかどうかを確認する方法をよく知っている人はいますか?

日付が次のようになる配列（またはオブジェクトの配列、これを呼び出す方法がよくわかりません）があります：

そして、値が 0、>3、または 5 かどうかを確認し、その日付にクラスを追加する必要があります。Flatpickr には例がありますが、数学関数を使用して、どの日付に新しいスパン要素を持たせるかをランダム化しています ( example )。しかし、if else を addClass に設定することはできません。

npm install flatpickr で flatpickr をインストールしました。入力コントロールをクリックしたときのようにカレンダーが表示されます

Flatpickrのノックアウト バインディングを作成しようとしていますが、うまくいきません。ここで受け入れられた回答からコードを微調整しようとしましたが、役に立ちませんでした。Flatpickr は初期化されていますが、セットアップしたデフォルトのオプションを使用していないようで、バインディングの更新部分がまったく機能しません。

私のコードは以下です。私はjsFiddleを作成しますが、ここでは仕事でブロックされています..

編集

私の状況についてもう少し情報を。上部にページャー ボタンがあるページがあり、これらのボタンはビューモデルの配列を循環します。ページをめくるたびに、displayedRecord プロパティが配列内の次/前の項目に設定され、すべての編集フィールドがdisplayedRecord プロパティにバインドされます。これは、@atitsbest から提供された datetimepicker バインディングを使用するものを除くすべての入力に対して正常に機能します。

datetimepicker フィールドは初めて入力されますが、一度ページを通過すると、そのレコードのビューモデル プロパティが何らかの形で null に設定されます。

編集2

これがついに機能しました。これが最終製品です。オブザーバブルをnullに設定しようとするとエラーが発生したため、init関数でサブスクライブを削除することになりました。また、ユーザーがクリア、トグルなどのための独自のボタンを提供するための flatpickr ラップ機能も追加されました。

私はフラットピッカーを使用しており、入力に与えられる日付は次のようになります:

1991 年 2 月 1 日 (1 日目 / 2 月 / 1991 年。

ただし、クラス flatpickr を追加すると、日付が次のように変換されます。

1991/02/01

日付のアメリカ版。

以下のコードを実行することで、これを簡単に修正できると思いました。

私が考えた重要な部分は、dateFormat: 'dmY' です。

ここで私が間違っていることを他の誰かが見つけることができますか?

どうもありがとう