angular-datetime-picker 形式をカスタマイズするにはどうすればよいですか?次の記事ではフォーマットのカスタマイズ方法について説明していますので、皆様のお役に立てれば幸いです。
私は最近、プロジェクトの開発と保守に Angular
を使用しています。日付の問題が発生し、同僚は @danielmoncada/angular-datetime-picker を使用しました。
PS: もちろん、新しいプロジェクトの場合は、フレームワークに統合された日付関数を使用することをお勧めします。この関数は期待どおりではないかもしれませんが、少なくとも十分です。 。たとえば、
ant design
のangular
バージョンです。
もちろん、angular-datetime-picker
は多くのプロパティとイベントを提供します。 [関連チュートリアルの推奨事項: "angularjs ビデオ チュートリアル "]
例:
owl-date-time
属性は次のとおりです:
属性名 | タイプ | 必要かどうか | デフォルト値 |
---|---|---|---|
両方、 カレンダー、 タイマー
| both
|
||
false |
入力ボックスに##もちろん、この記事では、その必要性については説明しません。これらのプロパティとメソッドを変更するだけです。次の 2 つの点について説明します。
Set => Set
次のような関連する html
1 2 3 4 |
|
Set time format1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 |
|
結果のグラフは次のとおりです:
翻訳ボタン
Cancel、
Set に翻訳する必要があります。
設定 に変換されます。
公式 Web サイトでは次のように紹介されています:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 |
|
owl-date-time-translator .ts
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
|
ここでは、地域に応じて言語を選択できる翻訳サービス
translationService を紹介しました。 次に、
app.module.ts
1 2 3 4 5 6 7 8 9 10 11 12 13 |
|
結果のレンダリングは次のようになります:
# #プログラミング関連の知識について詳しくは、プログラミング ビデオをご覧ください。 !
以上がangular-datetime-picker 形式をカスタマイズする方法について話しましょうの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。