キャンセル可能なカレンダーの終了時に発生します。
<igx-date-picker (closing)="handleClosing($event)"></igx-date-picker>
ピッカーを有効または無効にします。
<igx-date-picker [disabled]="'true'"></igx-date-picker>
編集可能な入力がフォーカスされていない場合に使用される形式。設定されていない場合、デフォルトは inputFormat です。
Angular の DatePipe を使用します。
<igx-time-picker displayFormat="mm:ss"></igx-time-picker>
Gets/Sets a custom formatter function on the selected or passed date.
<igx-time-picker [value]="date" [formatter]="formatter"></igx-time-picker>
ピッカーのヘッダーの向きを設定します。
dialog モードでのみ使用できます。デフォルト値は horizontal です。
<igx-time-picker [headerOrientation]="'vertical'"></igx-time-picker>
id 属性の値を設定する @Input プロパティ。
<igx-time-picker [id]="'igx-time-picker-5'" [displayFormat]="h:mm tt" ></igx-time-picker>
予想されるユーザー入力形式とプレースホルダー。
デフォルトはhh:mm tt です。
<igx-time-picker inputFormat="HH:mm"></igx-time-picker>
操作モード (dialog または drop down) を取得/設定します。
<igx-time-picker mode="dialog"></igx-time-picker>
カレンダーが開いた後に発生します。
<igx-date-picker (opened)="handleOpened($event)"></igx-date-picker>
キャンセル可能なカレンダーの開始時に発生します。
<igx-date-picker (opening)="handleOpening($event)"></igx-date-picker>
ポップアップ要素に使用されるコンテナー。
<div igxOverlayOutlet #outlet="overlay-outlet"></div>
<!-- ... -->
<igx-date-picker [outlet]="outlet"></igx-date-picker>
<!-- ... -->
ポップアップ要素の表示に使用されるオーバーレイ設定。
<igx-date-picker [overlaySettings]="customOverlaySettings"></igx-date-picker>
ピッカーの入力の placeholder を設定します。
<igx-date-picker [placeholder]="'Choose your date'"></igx-date-picker>
選択が行われた後に発生します。
<igx-time-picker (selected)="onSelection($event)"></igx-time-picker>
スピン動作を決定する @Input プロパティ。デフォルトで、spinLoop が true に設定されます。
時、分、秒が最小値または最大値に達したときにデフォルトで折り返します。
<igx-time-picker [spinLoop]="false"></igx-time-picker>
デフォルトのテンプレート エディターの tabindex を取得または設定します。
<igx-date-picker [tabIndex]="1"></igx-date-picker>
ユーザーがタイム ピッカー エディターで無効な時間を入力/スピンしたときに発生します。
<igx-time-picker (validationFailed)="onValidationFailed($event)"></igx-time-picker>
ピッカーの値が変更されたときに発生されます。
two-way バインディングに使用されます。
<igx-time-picker [(value)]="date"></igx-time-picker>
キャンセル ボタンのラベルを返すアクセサー。
カスタム テキストを使用して [キャンセル] ボタンを描画する @Input プロパティ。
デフォルトで cancelButtonLabel が Cancel に設定されます。
<igx-time-picker cancelButtonLabel='Exit' [value]="date" format="h:mm tt"></igx-time-picker>
ロップダウン/ダイアログが閉じたかどうかを取得します。
let isCollapsed = this.timePicker.collapsed;
コンポーネントのテーマを返します。
デフォルトのテーマは comfortable です。
利用可能なオプションは comfortable、cosy、または compact です。
let componentTheme = this.component.displayDensity;
コンポーネントのテーマを設定します。
スピン アクションで各エディターの日付部分を増減し、
ドロップダウン/ダイアログに時間部分を表示するために使用されるデルタ値。
デフォルトで itemsDelta は {hour: 1, minute: 1, second: 1} に設定されます。
<igx-time-picker [itemsDelta]="{hour:3, minute:5, second:10}" id="time-picker"></igx-time-picker>
date-picker の locale を取得します。
設定されていない場合、デフォルトでアプリケーションのロケールになります。
date-picker の locale を設定します。
有効な BCP 47 言語タグに設定します。
ピッカーが受け入れる最大値。
string 値が渡される場合、それは ISO 形式である必要があります。
<igx-time-picker [maxValue]="20:30:00"></igx-time-picker>
ピッカーが受け入れる最小値。
string 値が渡される場合、それは ISO 形式である必要があります。
<igx-time-picker [minValue]="18:00:00"></igx-time-picker>
OK ボタンのラベルを返すアクセサー。
カスタム テキストを使用して [OK] ボタンを描画する @Input プロパティ。デフォルトで、okButtonLabel が OK に設定されます。
<igx-time-picker okButtonLabel='SET' [value]="date" format="h:mm tt"></igx-time-picker>
リソース文字列を返すアクセサー。
リソース文字列を設定するアクセサー。 デフォルトで EN リソースを使用します。
ピッカーの入力のスタイル設定を決定します。
デフォルトは box です。
<igx-date-picker [type]="'line'"></igx-date-picker>
ドロップダウン/ダイアログから現在選択されている値/時間。
現在の値は Date タイプです。
const newValue: Date = new Date(2000, 2, 2, 10, 15, 15);
this.timePicker.value = newValue;
value 入力を使用して時間を設定するためのアクセサー。
public date: Date = new Date(Date.now());
//...
<igx-time-picker [value]="date" format="h:mm tt"></igx-time-picker>
週の最初の曜日を取得します。 曜日の数値または列挙型の表現を返します。 設定されていない場合、デフォルトでアプリケーション ロケールの週の初日になります。
週の最初の曜日を設定します。
数値または WEEKDAYS の列挙型の値に割り当てます。
ピッカーのダイアログ UI を開きます。
ピッカーのダイアログ UI を開きます。
カレンダーが閉じた後に発生します。
Example