You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
49 lines
893 B
TypeScript
49 lines
893 B
TypeScript
import { Component, OnInit, Input } from '@angular/core';
|
|
|
|
@Component({
|
|
selector: 'images-slider',
|
|
templateUrl: './images-slider.component.html',
|
|
styleUrls: ['./images-slider.component.scss']
|
|
})
|
|
export class ImagesSliderComponent implements OnInit {
|
|
|
|
@Input() url: string;
|
|
|
|
@Input() count: number;
|
|
|
|
|
|
@Input() interval = 1000;
|
|
|
|
public src: string;
|
|
private index = 0;
|
|
constructor() { }
|
|
|
|
ngOnInit() {
|
|
this.setNextImage();
|
|
if (this.isValid()) {
|
|
setInterval(() => {
|
|
this.setNextImage();
|
|
}, this.interval);
|
|
}
|
|
}
|
|
|
|
private setNextImage() {
|
|
this.src = this.url + this.nextIndex() + '.png';
|
|
}
|
|
private isValid() {
|
|
if (this.count && this.url) {
|
|
return this.count > 0;
|
|
}
|
|
return false;
|
|
}
|
|
|
|
|
|
private nextIndex(): number {
|
|
this.index = (this.index + 1) >= this.count ? 0 : this.index + 1;
|
|
return this.index;
|
|
}
|
|
|
|
}
|
|
|
|
|