項目がフォーカスを取得するかどうかを取得または設定します。デフォルトで無効です。 有効な場合、ドロップダウン項目にタブ インデックスが指定され、アクティブな場合にフォーカスされます。 これには、ドロップダウンを開き、キーボード ナビゲーションを使用して移動すると選択した項目のアクティブ化が含まれます。
注: IgxDropDownItemNavigation ディレクティブの使用時はフォーカスの移動に注意してください。 キーボード イベントを処理するためにディレクティブを各フォーカス可能な項目に配置または共有の先祖に配置します。
// get
let dropDownAllowsItemFocus = this.dropdown.allowItemsFocus;
<!--set-->
<igx-drop-down [allowItemsFocus]='true'></igx-drop-down>
ドロップダウンが閉じた後に発生されます。
<igx-drop-down (closed)='handleClosed($event)'></igx-drop-down>
ドロップダウンが閉じられる前に発生されます。
<igx-drop-down (closing)='handleClosing($event)'></igx-drop-down>
ドロップダウンの高さを取得または設定します。
// get
let myDropDownCurrentHeight = this.dropdown.height;
<!--set-->
<igx-drop-down [height]='400px'></igx-drop-down>
aria-labelledby 属性値を設定します。
<igx-drop-down [labelledby]="labelId"></igx-drop-down>
ドロップ ダウンのコンテナーの最大の高さを取得または設定します。
// get
let maxHeight = this.dropdown.maxHeight;
<!--set-->
<igx-drop-down [maxHeight]='200px'></igx-drop-down>
ドロップダウンが開かれた後に発生されます。
<igx-drop-down (opened)='handleOpened($event)'></igx-drop-down>
ドロップダウンが開かれる前に発生されます。
<igx-drop-down (opening)='handleOpening($event)'></igx-drop-down>
選択を完了する前に項目選択が変更されるときに発生されます。
<igx-drop-down (selectionChanging)='handleSelection()'></igx-drop-down>
ドロップダウンの幅を取得または設定します。
// get
let myDropDownCurrentWidth = this.dropdown.width;
<!--set-->
<igx-drop-down [width]='160px'></igx-drop-down>
ドロップダウンが閉じたかどうかを取得します。
let isCollapsed = this.dropdown.collapsed;
ドロップダウンの HTML 要素を取得します。
let myDropDownElement = this.dropdown.element;
すべてのヘッダー項目を取得します。
let myDropDownHeaderItems = this.dropdown.headers;
ドロップダウンの id を取得または設定します。
// get
let myDropDownCurrentId = this.dropdown.id;
<!--set-->
<igx-drop-down [id]='newDropDownId'></igx-drop-down>
ドロップダウンの id を取得または設定します。
// get
let myDropDownCurrentId = this.dropdown.id;
<!--set-->
<igx-drop-down [id]='newDropDownId'></igx-drop-down>
すべてのヘッダー以外の項目を取得します。
let myDropDownItems = this.dropdown.items;
ドロップダウンの内部リスト ボックスの id です。
現在選択している項目を取得します。
let currentItem = this.dropdown.selectedItem;
ドロップダウンの選択をクリアします。
this.dropdown.clearSelection();
ドロップダウンを閉じます。
this.dropdown.close();
ド指定されたインデックスにある項目へ移動します。 ロップダウンのデータが仮想化されている場合は、仮想化されたデータ内の項目のインデックスを渡します。
Angular がコンポーネントのビューの初期化を完了した直後に呼び出されるコールバック メソッド。 ビューがインスタンス化されるときに 1 回だけ呼び出されます。
デフォルトの変更検出がディレクティブのデータ バインド プロパティを初めてチェックした直後、およびビューまたはコンテンツの子要素がチェックされる前に呼び出されるコールバック メソッド。ディレクティブがインスタンス化されるときに 1 回だけ呼び出されます。
Keydown ハンドラー
項目をインデックスで選択します。
選択する項目。ドロップダウンで *igxFor が使用されている場合は、データのインデックスを渡します。
Ignite UI for Angular DropDown - ヘルプ
Ignite UI for Angular Drop Down は、単一項目の選択が可能なグループ項目をスクロール付きのリストで表示します。 項目をクリックまたはタップして選択するとドロップダウンが閉じられます。
例: