constructor

• new IgxTimePickerComponent(
      element: ElementRef,
      _localeId: string,
      _inputGroupType: IgxInputGroupType,
      _injector: Injector,
      platform: PlatformUtil,
      cdr: ChangeDetectorRef,
  ): IgxTimePickerComponent

  パラメーター

  • element: ElementRef

  • _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

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: string): 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: Pick<
          DatePartDeltas,
          "hours"
          | "minutes"
          | "seconds"
          | "fractionalSeconds",
      >,
  ): 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: string | Date): 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: string | Date): 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: string): 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: ITimePickerResourceStrings): 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: string | Date): 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?: DatePart, delta?: number): void

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

  例

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

  パラメーター

  • datePart: DatePart

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

  • delta: number

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

  返却 void

increment

• increment(datePart?: DatePart, delta?: number): void

  指定した DatePart を増加します

  例

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

  パラメーター

  • datePart: DatePart

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

  • delta: number

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

  返却 void

open

• open(settings?: OverlaySettings): 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: string | 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?: OverlaySettings): void

  パラメーター

  • settings: OverlaySettings

  返却 void