constructor

• new IgxTimePickerComponent(element, _localeId, _inputGroupType, _injector, platform, cdr): IgxTimePickerComponent

• パラメーター

  • element: ElementRef<any>

  • _localeId: string

  • _inputGroupType: IgxInputGroupType

  • _injector: Injector

  • platform: PlatformUtil

  • cdr: ChangeDetectorRef

  返却 IgxTimePickerComponent

displayFormat

<igx-time-picker displayFormat="mm:ss"></igx-time-picker>
Copy

formatter

<igx-time-picker [value]="date" [formatter]="formatter"></igx-time-picker>
Copy

headerOrientation

<igx-time-picker [headerOrientation]="'vertical'"></igx-time-picker>
Copy

id

<igx-time-picker [id]="'igx-time-picker-5'" [displayFormat]="h:mm tt" ></igx-time-picker>
Copy

inputFormat

<igx-time-picker inputFormat="HH:mm"></igx-time-picker>
Copy

mode

<igx-time-picker mode="dialog"></igx-time-picker>
Copy

selected

<igx-time-picker (selected)="onSelection($event)"></igx-time-picker>
Copy

spinLoop

<igx-time-picker [spinLoop]="false"></igx-time-picker>
Copy

validationFailed

<igx-time-picker (validationFailed)="onValidationFailed($event)"></igx-time-picker>
Copy

valueChange

<igx-time-picker [(value)]="date"></igx-time-picker>
Copy

cancelButtonLabel

• get cancelButtonLabel(): string

• キャンセル ボタンのラベルを返すアクセサーです。

  返却 string

• set cancelButtonLabel(value): void

• キャンセル ボタンのデフォルトのテキストをオーバーライドします。

  備考

  デフォルトでは、リソース文字列の値 (組み込み EN の場合は "Cancel") になります。

  <igx-time-picker cancelButtonLabel='Exit' [value]="date" format="h:mm tt"></igx-time-picker>
  Copy

  パラメーター

  • value: string

  返却 void

collapsed

• get collapsed(): boolean

• ドロップダウン/ダイアログが閉じたかどうかを取得します。

  let isCollapsed = this.timePicker.collapsed;
  Copy

  返却 boolean

itemsDelta

• get itemsDelta(): Pick<DatePartDeltas,
      | "hours"
      | "minutes"
      | "seconds"
      | "fractionalSeconds">

• 返却 Pick<DatePartDeltas,
      | "hours"
      | "minutes"
      | "seconds"
      | "fractionalSeconds">

• set itemsDelta(value): void

• スピン アクションで各エディターの日付部分を増減し、 ドロップダウン/ダイアログに時間部分を表示するために使用されるデルタ値です。 デフォルトで itemsDelta は {hour: 1, minute: 1, second: 1} に設定されます。

  <igx-time-picker [itemsDelta]="{hour:3, minute:5, second:10}" id="time-picker"></igx-time-picker>
  Copy

  パラメーター

  • value: Pick<DatePartDeltas,
        | "hours"
        | "minutes"
        | "seconds"
        | "fractionalSeconds">

  返却 void

maxValue

• get maxValue(): string | Date

• 返却 string | Date

• set maxValue(value): void

• ピッカーが受け入れる最大値です。

  備考

  string 値が渡される場合、それは ISO 形式である必要があります。

  例

  <igx-time-picker [maxValue]="20:30:00"></igx-time-picker>
  Copy

  パラメーター

  • value: string | Date

  返却 void

minValue

• get minValue(): string | Date

• 返却 string | Date

• set minValue(value): void

• ピッカーが受け入れる最小値です。

  備考

  string 値が渡される場合、それは ISO 形式である必要があります。

  例

  <igx-time-picker [minValue]="18:00:00"></igx-time-picker>
  Copy

  パラメーター

  • value: string | Date

  返却 void

okButtonLabel

• get okButtonLabel(): string

• OK ボタンのラベルを返すアクセサーです。

  返却 string

• set okButtonLabel(value): void
• 備考

  カスタム テキストを使用して [OK] ボタンを描画します。デフォルトで、okButtonLabel が OK に設定されます。

  <igx-time-picker okButtonLabel='SET' [value]="date" format="h:mm tt"></igx-time-picker>
  Copy

  パラメーター

  • value: string

  返却 void

resourceStrings

• get resourceStrings(): ITimePickerResourceStrings

• リソース文字列を返すアクセサーです。

  返却 ITimePickerResourceStrings

• set resourceStrings(value): void

• リソース文字列を設定するアクセサーです。 デフォルトで EN リソースを使用します。

  パラメーター

  • value: ITimePickerResourceStrings

  返却 void

value

• get value(): string | Date

• ドロップダウン/ダイアログから現在選択されている値/時間。

  備考

  現在の値のタイプは Date

  例

  const newValue: Date = new Date(2000, 2, 2, 10, 15, 15);
  this.timePicker.value = newValue;
  Copy

  返却 string | Date

• set value(value): void

• value 入力を使用して時間を設定するためのアクセサーです。

  public date: Date = new Date(Date.now());
   //...
  <igx-time-picker [value]="date" format="h:mm tt"></igx-time-picker>
  Copy

  パラメーター

  • value: string | Date

  返却 void

clear

• clear(): void

• タイム ピッカーの値が string の場合はクリアし、値が Date オブジェクトの場合は時間を 00:00:00 にリセットします。

  例

  this.timePicker.clear();
  Copy

  返却 void

close

• close(): void

• ドロップダウンを閉じます。

  <igx-time-picker #timePicker></igx-time-picker>
  Copy

  @ViewChild('timePicker', { read: IgxTimePickerComponent }) picker: IgxTimePickerComponent;
  picker.close();
  Copy

  返却 void

decrement

• decrement(datePart?, delta?): void

• 指定された DatePart を減少します。

  例

  this.timePicker.decrement(DatePart.Seconds);
  Copy

  パラメーター

  • datePart: DatePart

    減少するオプションの DatePart です。デフォルト値は Hour です。

  • delta: number

    減少に使用するオプションのデルタ。itemsDelta をオーバーライドします。

  返却 void

increment

• increment(datePart?, delta?): void

• 指定した DatePart を増加します

  例

  this.timePicker.increment(DatePart.Hours);
  Copy

  パラメーター

  • datePart: DatePart

    増分するオプションの DatePart です。デフォルト値は Hour です。

  • delta: number

    増分するデルタ (オプション)。itemsDelta をオーバーライドします。

  返却 void

open

• open(settings?): void

• ピッカーのダイアログ UI を開きます。

  パラメーター

  • settings: OverlaySettings

    OverlaySettings - ドロップダウンまたはダイアログ コンテナーを適切に配置するために使用するオーバーレイ設定。

    <igx-time-picker #picker [value]="date"></igx-time-picker>
    <button type="button" igxButton (click)="picker.open()">Open Dialog</button>
    Copy

  返却 void

select

• select(date): void

• igxTimePicker から時間を選択します。

  例

  this.timePicker.select(date);
  
  @param date Date object containing the time to be selected
  Copy

  パラメーター

  • date: string | Date

  返却 void

toggle

• toggle(settings?): void

• パラメーター

  • settings: OverlaySettings

  返却 void