This is a migrated thread and some comments may be shown as answers.

ng-If To Hide a Tab Causes Rendering Problems

3 Answers 567 Views
TabStrip
This is a migrated thread and some comments may be shown as answers.
Scantron-Morrisville
Top achievements
Rank 1
Scantron-Morrisville asked on 24 Aug 2015, 09:14 PM

When updating to 2015.2.805, we've discovered a NUMBER of  problems with our usage of Angular and Kendo.  We regularly update, and have had no problems previously.  We're hoping we can get some answers as to the problem(s).

 

We use ng-ifs to hide/show tabs based on certain parameters.  In the latest release, this technique breaks the rendering of the tabstrip.

http://dojo.telerik.com/arEfI/2

 

Here's the previous release, where it works just fine. 

http://dojo.telerik.com/EDibu/2

What's wrong?​

3 Answers, 1 is accepted

Sort by
0
Petyo
Telerik team
answered on 26 Aug 2015, 07:35 AM

Hello Grant,

 

the approach you have taken is not supported and has worked by accident previously. In general, modifying the widget markup with angular directives is not supported and may lead to unexpected results. As an alternative, I may suggest that you prepare the configuration of the tabstrip as a JavaScript object and pass it to the component via the dataSource configuration option - like this (several other examples are present here, too).

 

Regards,
Petyo
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Rob
Top achievements
Rank 1
answered on 31 Mar 2016, 11:50 PM
We use the tabstrip LI container to display an image with the text and sometimes a record count for the data the tab contains.  How would we accomplish that using the dataSource method?  I don't see any property we can set for the content of the tab item itself.
0
Rob
Top achievements
Rank 1
answered on 31 Mar 2016, 11:55 PM
I did find a workaround for this.  ng-show doesn't exhibit the rendering problem and accomplishes almost the same thing. 
Tags
TabStrip
Asked by
Scantron-Morrisville
Top achievements
Rank 1
Answers by
Petyo
Telerik team
Rob
Top achievements
Rank 1
Share this question
or