展開パネルが縮小を完了したときに発生されます。
handleCollapsed(event: IExpansionPanelEventArgs)
<igx-expansion-panel (contentCollapsed)="handleCollapsed($event)">
...
</igx-expansion-panel>
拡張パネルが縮小を開始するときに発生します。
handleCollapsing(event: IExpansionPanelCancelableEventArgs)
<igx-expansion-panel (contentCollapsing)="handleCollapsing($event)">
...
</igx-expansion-panel>
展開パネルが展開を完了したときに発生されます。
handleExpanded(event: IExpansionPanelEventArgs)
<igx-expansion-panel (contentExpanded)="handleExpanded($event)">
...
</igx-expansion-panel>
展開パネルが展開を開始したときに発生します。
handleExpanding(event: IExpansionPanelCancelableEventArgs)
<igx-expansion-panel (contentExpanding)="handleExpanding($event)">
...
</igx-expansion-panel>
展開パネル コンポーネントの id
を設定または取得します。
設定しない場合、id
は "igx-expansion-panel-0"
を持ちます。
<igx-expansion-panel id = "my-first-expansion-panel"></igx-expansion-panel>
let panelId = this.panel.id;
IgxExpansionPanelComponent
展開パネルコンポーネントのアニメーション設定を設定または取得します。 Open および Close アニメーションを渡す必要があります。
次を取得:
const currentAnimations = this.panel.animationSettings;
次を設定:
import { slideInLeft, slideOutRight } from 'igniteui-angular';
...
this.panel.animationsSettings = {
openAnimation: slideInLeft,
closeAnimation: slideOutRight
};
またはテンプレート経由
import { slideInLeft, slideOutRight } from 'igniteui-angular';
...
myCustomAnimationObject = {
openAnimation: slideInLeft,
closeAnimation: slideOutRight
};
```html
<igx-expansion-panel [animationSettings]='myCustomAnimationObject'>
...
</igx-expansion-panel>
コンポーネントが縮小された (コンテンツが非表示) かどうかを取得または設定します。 次を取得:
次を設定:
双方向データ バインディング: