バナー非表示後に発生します。
public handleClosed(event) {
...
}
<igx-banner (closed)="handleClosed($event)"></igx-banner>
バナー非表示前に発生します。
public handleClosing(event) {
...
}
<igx-banner (closing)="handleClosing($event)"></igx-banner>
バナー表示後に発生します。
public handleOpened(event) {
...
}
<igx-banner (opened)="handleOpened($event)"></igx-banner>
バナー表示前に発生します。
public handleOpening(event) {
...
}
<igx-banner (opening)="handleOpening($event)"></igx-banner>
バナーを開く/閉じるメソッドで使用されるアニメーション設定を取得します。
let currentAnimations: ToggleAnimationSettings = banner.animationSettings
バナーを開く/閉じるメソッドで使用されるアニメーション設定を取得します。
import { slideInLeft, slideOutRight } from 'igniteui-angular';
...
banner.animationSettings: ToggleAnimationSettings = { openAnimation: slideInLeft, closeAnimation: slideOutRight };
バナーが閉じられるかどうかを取得します。
const isCollapsed: boolean = banner.collapsed;
バナー コンポーネントのネイティブ要素を返します。
const myBannerElement: HTMLElement = banner.element;
バナーを閉じます。
myBanner.close();
<igx-banner #banner>
...
</igx-banner>
<button type="button" (click)="banner.close()">Close Banner</button>
バナーを開きます。
myBanner.open();
<igx-banner #banner>
...
</igx-banner>
<button type="button" (click)="banner.open()">Open Banner</button>
バナーを切り替えます。
myBanner.toggle();
<igx-banner #banner>
...
</igx-banner>
<button type="button" (click)="banner.toggle()">Toggle Banner</button>
Ignite UI for Angular Banner - ヘルプ
Ignite UI Banner は、テンプレート化が可能な簡単に使用できるバナーです。
使用方法: