swiper.ts

import {AfterViewInit, Component, Input, OnChanges, SimpleChange, SimpleChanges} from '@angular/core';
import {AppGlobal} from "../../service/http.service";
import {TabsService} from "../../pages/tabs/tabs.service";

declare let Swiper: any;

@Component({
    selector: 'swiper',
    templateUrl: 'swiper.html',
})
export class SwiperComponent implements OnChanges {
    @Input() inputValue;

    picture: string = AppGlobal.domain + '/wisdomgroup';
    slideTitle;
    slideIndex;
    slidersItems = [];
    swiper = null;

    constructor(private tabsSer: TabsService) {
        this.initSwiper();
    }

    initSwiper() {
        let that = this;
        that.swiper = new Swiper('#swiper-component', {
            speed: 1000,
            autoplay:{
                delay: 3000,
                disableOnInteraction: false,
            },//可选选项，自动滑动
            observer: true,
            observeParents: true,
            observeSlideChildren:true,
            loop: true,
            on: {
                slideChangeTransitionEnd: function () {
                    console.log(that.swiper);
                    that.slideIndex = this.activeIndex;
                    // that.slideTitle = that.slidersItems[this.activeIndex -1].title;
                    that.swiper.update();
                },
            }
        })
    }

    ngOnChanges(change: SimpleChanges) {
        if (change['inputValue'] && change['inputValue'].currentValue.length > 0) {
            this.slidersItems = change['inputValue'].currentValue;
            console.dir(change['inputValue'].currentValue);
        }
    }

}