Slider tabs: Fix initialization.
This commit is contained in:
parent
9855f5c179
commit
584f1d22f8
|
@ -145,38 +145,43 @@ export class SliderTabsComponent implements AfterViewInit, OnDestroy {
|
||||||
}
|
}
|
||||||
|
|
||||||
ngAfterViewInit() {
|
ngAfterViewInit() {
|
||||||
this.tabs.changes.subscribe(tabs => {
|
this.initTabs();
|
||||||
if (typeof document !== 'undefined' && this.tabs.length > 0) {
|
this.tabs.changes.subscribe(() => {
|
||||||
setTimeout(() => {
|
this.initTabs();
|
||||||
if (this.position === 'horizontal') {
|
|
||||||
this.slider = UIkit.slider(this.sliderElement.nativeElement, {finite: true});
|
|
||||||
this.slider.clsActive = 'uk-slider-active';
|
|
||||||
this.slider.updateActiveClasses();
|
|
||||||
this.slider.slides.forEach((item, index) => {
|
|
||||||
if(!this.tabs.get(index).active) {
|
|
||||||
item.classList.remove('uk-active');
|
|
||||||
}
|
|
||||||
});
|
|
||||||
if (this.type === 'static') {
|
|
||||||
let tabs = UIkit.tab(this.tabsElement.nativeElement, {connect: this.connect});
|
|
||||||
tabs.show(this.activeIndex);
|
|
||||||
if (this.connect.includes('#')) {
|
|
||||||
this.scrollToStart();
|
|
||||||
}
|
|
||||||
} else if(this.type =='dynamic') {
|
|
||||||
this.activeIndex = this.tabs.toArray().findIndex(tab => tab.active);
|
|
||||||
this.slider.show(this.activeIndex);
|
|
||||||
} else if (this.type === 'scrollable') {
|
|
||||||
this.scrollable(this.slider);
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
this.scrollable();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
public initTabs() {
|
||||||
|
if (typeof document !== 'undefined' && this.tabs.length > 0) {
|
||||||
|
setTimeout(() => {
|
||||||
|
if (this.position === 'horizontal') {
|
||||||
|
this.slider = UIkit.slider(this.sliderElement.nativeElement, {finite: true});
|
||||||
|
this.slider.clsActive = 'uk-slider-active';
|
||||||
|
this.slider.updateActiveClasses();
|
||||||
|
this.slider.slides.forEach((item, index) => {
|
||||||
|
if(!this.tabs.get(index).active) {
|
||||||
|
item.classList.remove('uk-active');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
if (this.type === 'static') {
|
||||||
|
let tabs = UIkit.tab(this.tabsElement.nativeElement, {connect: this.connect});
|
||||||
|
tabs.show(this.activeIndex);
|
||||||
|
if (this.connect.includes('#')) {
|
||||||
|
this.scrollToStart();
|
||||||
|
}
|
||||||
|
} else if(this.type =='dynamic') {
|
||||||
|
this.activeIndex = this.tabs.toArray().findIndex(tab => tab.active);
|
||||||
|
this.slider.show(this.activeIndex);
|
||||||
|
} else if (this.type === 'scrollable') {
|
||||||
|
this.scrollable(this.slider);
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
this.scrollable();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
private scrollToStart() {
|
private scrollToStart() {
|
||||||
this.subscriptions.push(UIkit.util.on(this.connect, 'shown', (event): void => {
|
this.subscriptions.push(UIkit.util.on(this.connect, 'shown', (event): void => {
|
||||||
let index = event.detail[0].index();
|
let index = event.detail[0].index();
|
||||||
|
|
Loading…
Reference in New Issue