カルーセルの id を設定します。
設定されない場合、最初のカルーセル コンポーネントの id は "igx-carousel-0" になります。
<igx-carousel id="my-first-carousel"></igx-carousel>カルーセルが最後のスライドの後に最初のスライドに戻る (loop) かどうかを設定します。
デフォルト値は true です。
<igx-carousel [loop]="false"></igx-carousel>カルーセルに左/右のナビゲーション (navigation) ボタンを描画するかどうかを制御します。
デフォルト値は true です。
<igx-carousel [navigation] = "false"></igx-carousel>カルーセルが一時停止された後に発生するイベント。
イベント引数として IgxCarouselComponent への参照を提供します。
<igx-carousel (onCarouselPaused)="onCarouselPaused($event)"></igx-carousel>カルーセルが slides の間の移動を再開した後に発生するイベント。
イベント引数として IgxCarouselComponent への参照を提供します。
<igx-carousel (onCarouselPlaying)="onCarouselPlaying($event)"></igx-carousel>スライドがカルーセルに追加された後に発生するイベント。
イベント引数として IgxCarouselComponent および IgxSlideComponent への参照を提供します。
<igx-carousel (onSlideAdded)="onSlideAdded($event)"></igx-carousel>スライド トランジションが実行された後に発生するイベント。
イベント引数として IgxCarouselComponent および IgxSlideComponent への参照を提供します。
<igx-carousel (onSlideChanged)="onSlideChanged($event)"></igx-carousel>スライドがカルーセルから削除された後に発生するイベント。
イベント引数として IgxCarouselComponent および IgxSlideComponent への参照を提供します。
<igx-carousel (onSlideRemoved)="onSlideRemoved($event)"></igx-carousel>カルーセルがユーザー インタラクションでスライド トランジションを一時停止する (pause) かどうかを設定します。
デフォルト値は true です。
<igx-carousel [pause]="false"></igx-carousel>カルーセルの role 属性を返します。
let carouselRole = this.carousel.role;カルーセルにある slides のコレクション。
let slides: IgxSlideComponent[] = this.carousel.slides;表示しているスライドのインデックス。
let currentSlideNumber = this.carousel.current;スライドが変わる前の間隔 (interval) をミリ秒で返します。
let timeInterval = this.carousel.interval;スライドが変わる前の間隔 (interval) をミリ秒で設定します。
設定されない場合、カルーセルは slides を自動的に変更しません。
<igx-carousel [interval] = "1000"></igx-carousel>カルーセルが破棄されたかどうかを示すブール値を返します。
let isDestroyed = this.carousel.isDestroyed;カルーセルが再生しているかどうかを示すブール値を返します。
let isPlaying = this.carousel.isPlaying;DOM でカルーセル要素への参照を返します。
let nativeElement = this.carousel.nativeElement;カルーセル コンポーネントの tabIndex を返します。
let tabIndex = this.carousel.tabIndex;カルーセルで slides の総数を返します。
let slideCount = this.carousel.total;カルーセルに新しいスライドを追加します。
this.carousel.add(newSlide);既定の index に対応するスライドまたは null を返します。
let slide1 = this.carousel.get(1);カルーセルで次のスライドに移動します。
this.carousel.next();一時停止状態の場合、カルーセルの再生を再開します。 それ以外の場合、動作しません。
this.carousel.play();
}カルーセルで前のスライドに移動します。
this.carousel.prev();スライドをカルーセルから削除します。
this.carousel.remove(slide);指定した direction に移動する指定したスライドのトランジションを実行します。
this.carousel.select(this.carousel.get(2), Direction.NEXT);pause オプションが true に設定される場合、スライドのトランジションを停止します。
それ以外の場合、動作しません。
this.carousel.stop();
}
Ignite UI for Angular Carousel - ヘルプ
Ignite UI Carousel はスライド コレクションのブラウズやナビゲーションに使用されます。Slides can contain custom スライドは画像またはカードなどのカスタム コンテンツを含みます。チュートリアルまたはページに分割されるインターフェイスなどに使用できます。 別の全画面要素として使用、またはその他のコンポーネントに含むことができます。 Example:
<igx-carousel> <igx-slide> <h3>First Slide Header</h3> <p>First slide Content</p> <igx-slide> <igx-slide> <h3>Second Slide Header</h3> <p>Second Slide Content</p> </igx-carousel>