IgxSelectComponent を無効にする @Input プロパティ。
<igx-select [disabled]="'true'"></igx-select>
ドロップダウンが閉じた後に発生されます。
<igx-drop-down (onClosed)='handleClosed()'></igx-drop-down>
ドロップダウンが閉じられる前に発生されます。
<igx-drop-down (onClosing)='handleClosing()'></igx-drop-down>
ドロップダウンが開かれた後に発生されます。
<igx-drop-down (onOpened)='handleOpened()'></igx-drop-down>
ドロップダウンが開かれる前に発生されます。
<igx-drop-down (onOpening)='handleOpening()'></igx-drop-down>
選択を完了する前にアイテム選択が変更されるときに発生されます。
<igx-drop-down (onSelection)='handleSelection()'></igx-drop-down>
カスタム OverlaySettings IgxSelectComponent を設定する @Input プロパティ。
<igx-select [overlaySettings] = "customOverlaySettings"></igx-select>
入力 プレースホルダーを設定する @Input プロパティ。
カスタム テンプレートがある場合、選択 TOGGLE (開く/閉じる) ボタンを描画するために使用されるカスタム テンプレート。
// Typescript に設定
const myCustomTemplate: TemplateRef<any> = myComponent.customTemplate;
myComponent.select.toggleIconTemplate = myCustomTemplate;
<!-- Set in markup -->
<igx-select #select>
...
<ng-template igxSelectToggleIcon let-collapsed>
<igx-icon>{{ collapsed ? 'remove_circle' : 'remove_circle_outline'}}</igx-icon>
</ng-template>
</igx-select>
選択のスタイル設定するを設定する @Input プロパティ。
有効な値は line、 box および border。デフォルトは line です。
<igx-select [type]="'box'"></igx-select>
ドロップダウンが閉じたかどうかを取得します。
let isCollapsed = this.dropdown.collapsed;
コンポーネントのテーマを返します。
デフォルト テーマは comfortable です。
利用可能なオプションは comfortable、cosy、および compact です。
let componentTheme = this.component.displayDensity;
コンポーネントのテーマを設定します。
ドロップダウンの HTML 要素を取得します。
let myDropDownElement = this.dropdown.element;
すべてのヘッダー項目を取得します。
let myDropDownHeaderItems = this.dropdown.headers;
すべてのヘッダー以外の項目を取得します。
let myDropDownItems = this.dropdown.items;
ドロップダウンの内部リスト ボックスの Id。
コンポーネントの値を取得または設定する @Input プロパティ。
// 取得
let selectValue = this.select.value;
// 設定
this.select.value = 'London';
<igx-select [value]="value"></igx-select>
コンポーネントの値を取得または設定する @Input プロパティ。
// 取得
let selectValue = this.select.value;
// 設定
this.select.value = 'London';
<igx-select [value]="value"></igx-select>
ドロップダウンを閉じます。
this.dropdown.close();
指定されたインデックスにある項目へ移動。 ドロップダウンのデータが仮想化されている場合は、仮想化されたデータ内のアイテムのインデックスを渡します。
Keydown ハンドラー
選択されたのを開きます。
this.select.open();
項目をインデックスで選択します。
選択する項目。ドロップダウンで *igxFor が使用されている場合は、データのインデックスを渡します。
ドロップダウンを切り替えます。
this.dropdown.toggle();
Ignite UI for Angular Select - ヘルプ
igxSelectは、単一項目の選択ができるドロップダウン リストの入力を提供します。 例:<igx-select #select1 [placeholder]="'Pick One'"> <label igxLabel>Select Label</label> <igx-select-item *ngFor="let item of items" [value]="item.field"> {{ item.field }} </igx-select-item> </igx-select>