diff --git a/sharedComponents/tabs/slider-tabs.component.ts b/sharedComponents/tabs/slider-tabs.component.ts index 75c86cfd..bf05910a 100644 --- a/sharedComponents/tabs/slider-tabs.component.ts +++ b/sharedComponents/tabs/slider-tabs.component.ts @@ -145,37 +145,42 @@ export class SliderTabsComponent implements AfterViewInit, OnDestroy { } ngAfterViewInit() { - this.tabs.changes.subscribe(tabs => { - 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(); - } - }); - } + this.initTabs(); + this.tabs.changes.subscribe(() => { + this.initTabs(); }); } + + 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() { this.subscriptions.push(UIkit.util.on(this.connect, 'shown', (event): void => {