TabsComponent does not show selectors when there are too many tabs panels.

[Swany]

TabsComponent does not show selectors when there are too many tabs panels. If you create more tab panels then can fit in the component area. The selectors do not show up on the sides, as they do with the jQuery Tab Component. Please see attached pictures.

[jarry]

The scrolling tab feature is coming soon.

[Swany]

Thanks you for the reply.

[jarry]

The scrollable tabs is available now. Please look at this example https://www.jeasyui.com/demo-angular/main/index.php?plugin=Tabs&theme=material&dir=ltr&pitem=Scrollable%20Tabs&sort=

[Swany]

Jarry,

I updated to the newest version 1.0.1 and added the variable to to the eu-tab tag. But now I get an error saying "Cannot read property 'offsetWidth' of undefined". I have attached a log for the error.

Andy

[Swany]

Jarry,

Any update?

[jarry]

This example works fine.

https://www.jeasyui.com/demo-angular/main/index.php?plugin=Tabs&theme=material&dir=ltr&pitem=Scrollable%20Tabs&sort=

[Swany]

Jarry,

Issue was corrected with the update to version 1.1.11. This could have been correct earlier, but I just got around to retesting it with this update.

Thanks

[khan]

I have tested TabsComponent scrollable property with true value. In the below function. this.tabsRef is undefined. Can't read nativeElement property. I have tried extending TabsComponent. It has another TabPanelComponent inside its. So, I didn't solve the problem. I have tested with ng-easyui 1.3.0 version.

Code:

get maxScrollDistance() {
        //let width = domHelper.outerWidth(this.tabsRef.nativeElement);
	let width = this.tabsRef.nativeElement.scrollWidth;
	let wrapWidth = this.tabsWrapRef.nativeElement.offsetWidth;
	return width > wrapWidth ? width - wrapWidth : 0;
}

[jarry]

This issue has been fixed. Please try to update to the newest version.

[khan]

Updated 1.3.2 version. It works fine. Thanks...