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

Using ui-router with TabStrip

2 Answers 129 Views
TabStrip
This is a migrated thread and some comments may be shown as answers.
James
Top achievements
Rank 1
James asked on 05 Oct 2015, 03:51 PM

I am trying to implement a Kendo Tab Strip and that applies ui-router to display the contents of the tab. I can get the tab strip to display but not the contents using the ui-view. Anyone have an example of how to make these items work together.
Sample of my html.

<div class="main-template">
    <div class="row">
        <h3>Welcome to the Dashboard</h3>
        <div ng-controller="Navigation">
            <div kendo-tab-strip k-content-urls="[ null, null]">
                <!-- tab list -->
                <ul>
                    <li class="k-state-active" url="#/invoice">Invoice Management</li>
                    <li url="#/shipment">Shipment Management</li>
                </ul>
            </div>
            <div ui-view></div>
        </div>
    </div>
</div>


2 Answers, 1 is accepted

Sort by
0
James
Top achievements
Rank 1
answered on 05 Oct 2015, 06:13 PM
I needed to use ui-sref instead of url in my li's
0
Petyo
Telerik team
answered on 07 Oct 2015, 06:45 AM

Hello James,

 

we haven't explored such scenario, but from what I know about the ui-router, most likely it can't be done without significant changes of the tabstrip widget itself. In fact, it may be simpler to use the tabstrip markup and CSS classes without the directive itself and rely on the routing mechanism to provide the interactivity part. Notice however, that such scenario is a custom one, which we can't provide further support on. 

 

Regards,
Petyo
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
TabStrip
Asked by
James
Top achievements
Rank 1
Answers by
James
Top achievements
Rank 1
Petyo
Telerik team
Share this question
or