1.3.0 • Published 7 years ago
imeepos-angular-swiper v1.3.0
由标准angular/cli项目生成的 swiper项目
html用法
<link href="//cdn.bootcss.com/Swiper/3.4.2/css/swiper.min.css" rel="stylesheet">
<div class="index">
<meepo-slides
[options]="swiperOptions"
[items]="swiperItems"
(success)="initSwiperSuccess($event)"
></meepo-slides>
<meepo-slides-water></meepo-slides-water>
</div>
引入模块
import { SlidesModule } from 'imeepos-angular-swiper';
@NgModule({
imports: [
SlidesModule
]
})
export class AppModule { }
使用案例
import { Component } from '@angular/core';
import {initSlidesOptions, SlidesOptions } from "./slides/slides/slides.component";
interface Swiper{
options: SlidesOptions;
items: any[];
success: Function;
}
@Component({
selector: 'meepo-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = 'app works!';
swiper1: Swiper;
swiper: any; //返回控制器
constructor(){
this.initSwiperOption();
// setInterval(()=>{
// this.swiper1.items.push({
// image: '/assets/1.jpg',
// handler: (item)=>{
// console.log(item)
// }
// })
// }, 10000)
}
initSwiperOption(){
const opt = initSlidesOptions();
opt.slidesPerView = 1;
this.swiper1 = {
options: opt,
items: [{
image: '/assets/1.jpg',
handler: (item) => {
console.log(item)
}
},{
image: '/assets/2.jpg',
handler: (item) => {
console.log(item)
}
},{
image: '/assets/3.jpg',
handler: (item) => {
console.log(item)
}
}],
success: (swiper) => {
this.swiper = swiper;
}
}
}
}
1.3.0
7 years ago
1.2.9
7 years ago
1.2.7
7 years ago
1.2.6
7 years ago
1.2.5
7 years ago
1.2.4
7 years ago
1.2.1
7 years ago
1.2.0
7 years ago
1.1.9
7 years ago
1.1.8
7 years ago
1.1.6
7 years ago
1.1.5
7 years ago
1.1.4
7 years ago
1.1.3
7 years ago
1.1.2
7 years ago
1.1.1
7 years ago
1.0.10
7 years ago
1.0.9
7 years ago
1.0.8
7 years ago
1.0.7
7 years ago
1.0.6
7 years ago
1.0.5
7 years ago
1.0.4
7 years ago
1.0.2
7 years ago
1.0.1
7 years ago
1.0.0
7 years ago
0.0.0
7 years ago