0.1.4 • Published 6 years ago
iwe7 swiper
组件 | 说明 | 类型 | 使用 |
---|
swiper-outlet | 容器 | Component | element |
swiperItem | slide模板 | Directive | ng-template |
swiperDot | dot模板 | Directive | ng-template |
swiper-outlet
输入 | 默认 | 类型 |
---|
hasDot | true | boolean |
loop | true | boolean |
click | true | boolean |
autoPlay | true | boolean |
scrollX | true | boolean |
scrollY | false | boolean |
interval | 4000 | number |
threshold | 0.3 | number |
speed | 400 | number |
list | [] | array |
<swiper-outlet [list]="list"></swiper-outlet>
<button mat-flat-button (click)="showDialogX()">showDialogX</button>
<button mat-flat-button (click)="showDialogY()">showDialogY</button>
<ng-template #tplX>
<swiper-outlet [list]="list"></swiper-outlet>
</ng-template>
<ng-template #tplY>
<swiper-outlet scrollY [list]="list"></swiper-outlet>
</ng-template>
list: any[] = [{
image: 'http://y.gtimg.cn/music/photo_new/T003R720x288M000004ckGfg3zaho0.jpg'
}, {
image: 'http://y.gtimg.cn/music/photo_new/T003R720x288M000004ckGfg3zaho0.jpg'
}];
showDialogX() {
this.getCyc('ngAfterViewInit').subscribe(res => {
const dialogRef = this.dialog.open(this.tplX);
});
}
showDialogY() {
this.getCyc('ngAfterViewInit').subscribe(res => {
const dialogRef = this.dialog.open(this.tplY);
});
}