コンテンツ子として定義されている Tab Bar コンポーネントの IgxTabComponent 要素を取得します。
let tabs: QueryList<IgxTabComponent> = this.tabBar.contentTabs;
タブ バーの id を取得または設定します。
設定されない場合、最初のタブ バー コンポーネントの id は "igx-bottom-nav-0" になります。
<igx-bottom-nav id = "my-first-tab-bar"></igx-bottom-nav>
let tabBarId = this.tabBar.id;
タブが選択解除されたときにイベントを発生します。
イベント引数として IgxTabComponent および IgxTabPanelComponent への参照を提供します。
<igx-bottom-nav (onTabDeselected) = "onTabDeselected($event)"><igx-bottom-nav>
新しいタブが選択されたときにイベントを発生します。
イベント引数として IgxTabComponent および IgxTabPanelComponent への参照を提供します。
<igx-bottom-nav (onTableSelected) = "onTabSelected($event)"><igx-bottom-nav>
タブ バー コンポーネントで IgxTabPanelComponent 要素を取得します。
let tabPanels: QueryList<IgxTabPanelComponent> = this.tabBar.panels;
各コレクションの選択済みのタブまたはパネルの index を取得します。
let index = this.tabBar.selectedIndex;
提供されたパネルに基づいて作成されたタブバー コンポーネントの IgxTabComponent 要素を取得します。
let tabs: QueryList<IgxTabComponent> = this.tabBar.viewTabs;
タブ バーの itemStyle を取得します。
let itemStyle = this.tabBar.itemStyle;
タブ バーの選択したタブを取得します。
let tab = this.tabBar.selectedTab;
この下部のナビゲーション コンポーネントの IgxTabComponent 要素を取得します。
最初にコンテンツの子として取得します。使用できない場合は、ビューの子として取得します。
let tabs: QueryList<IgxTabComponent> = this.tabBar.tabs;
Ignite UI for Angular Tab Bar - ヘルプ
Ignite UI Tab Bar は、単一ビューで表示される複数のコンテンツ パネル間での移動を可能にします。 例:
<igx-bottom-nav> <igx-tab-panel label="Tab 1">Tab 1 Content</igx-tab-panel> <igx-tab-panel label="Tab 2">Tab 2 Content</igx-tab-panel> <igx-tab-panel label="Tab 3">Tab 3 Content</igx-tab-panel> </igx-bottom-nav>