<igx-date-picker (closed)="handleClosed($event)"></igx-date-picker>
キャンセル可能なカレンダーの終了時に発生します。
<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>
選択または渡された日付のカスタムフォーマッター関数を取得または設定します。
<igx-time-picker [value]="date" [formatter]="formatter"></igx-time-picker>
ピッカーのヘッダーの向きを設定します。
dialog モードでのみ使用できます。デフォルト値は horizontal です。
<igx-time-picker [headerOrientation]="'vertical'"></igx-time-picker>
id 属性の値を設定します。
<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>
終了値に達したときに秒、分、時間の回転をループするかどうかを設定します。 デフォルトでは 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>
キャンセル ボタンのラベルを返すアクセサーです。
キャンセル ボタンのデフォルトのテキストをオーバーライドします。
デフォルトでは、リソース文字列の値 (組み込み EN の場合は "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] ボタンを描画します。デフォルトで、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 の列挙型の値に割り当てます。
指定された DatePart を減少します。
this.timePicker.decrement(DatePart.Seconds);
減少するオプションの DatePart です。デフォルト値は Hour です。
減少に使用するオプションのデルタ。itemsDelta をオーバーライドします。
表示密度の値に基づいて --component-size CSS 変数を設定します。
指定した DatePart を増加します
this.timePicker.increment(DatePart.Hours);
増分するオプションの DatePart です。デフォルト値は Hour です。
増分するデルタ (オプション)。itemsDelta をオーバーライドします。
ピッカーのダイアログ UI を開きます。
OverlaySettings - ドロップダウンまたはダイアログ コンテナーを適切に配置するために使用するオーバーレイ設定。
<igx-time-picker #picker [value]="date"></igx-time-picker>
<button type="button" igxButton (click)="picker.open()">Open Dialog</button>
カレンダーが閉じた後に発生します。