@ciri/ngx-carousel
Version:
A simple angular carousel component.
66 lines (65 loc) • 2.38 kB
TypeScript
import { AfterViewInit, ChangeDetectorRef, ElementRef, EventEmitter, OnDestroy, OnInit, QueryList, Renderer2, TemplateRef } from '@angular/core';
import { BehaviorSubject } from 'rxjs';
import { CarouselData } from '../carousel.model';
import { CarouselItemComponent } from '../carousel-item/carousel-item.component';
export declare class CarouselComponent implements OnInit, AfterViewInit, OnDestroy {
private renderer;
private hostElRef;
private cdr;
/** 是否开启无缝模式 */
loop: boolean;
/** 切换速度(ms) */
speed: number;
/** 自动轮播时间间隔,0 代表关闭自动轮播 */
autoplay: number;
/** 是否跟随手指滑动,设为 false 代表只在松手后进行移动判断 */
followFinger: boolean;
/** 是否允许手动滑动,设为 false 代表只能通过 api 翻页 */
allowTouchMove: boolean;
/** 自定义指示器 */
indicator: TemplateRef<{
$implicit: CarouselData;
}>;
/** 默认激活项 */
initialIndex: number;
/** lazyRender 模式下预渲染个数,1 代表左右多渲染一个,2 代表左右多渲染两个,... */
lazyRenderOffset: number;
/** 是否缓存 lazyRender 模式下渲染过的 item,不从 dom 树中删除 */
cache: boolean;
/** 索引变动时触发 */
indexChange: EventEmitter<number>;
track: ElementRef;
items: QueryList<CarouselItemComponent>;
readonly active: number;
readonly count: number;
readonly viewport: any;
readonly width: any;
readonly canMove: boolean;
readonly data: CarouselData;
active$: BehaviorSubject<number>;
private destroy$;
private intervalSub;
private percent;
private offset;
private animating;
private preMirrorNode;
private postMirrorNode;
constructor(renderer: Renderer2, hostElRef: ElementRef, cdr: ChangeDetectorRef);
ngOnInit(): void;
ngAfterViewInit(): void;
ngOnDestroy(): void;
onPanStart(e: HammerInput): void;
onPanMove(e: HammerInput): void;
onPanEnd(e: HammerInput): void;
goTo(target?: number, immediate?: boolean): void;
prev(): void;
next(): void;
private init;
private getSafeDeltaX;
private getSafeActive;
private getRealActive;
private handleMirrorNodes;
private move;
private startAutoplay;
private stopAutoplay;
}