Use ng-repeat to render ul+li

[Werner Haltner]

i use the "kendo-panel-bar" wich works good with static data.

but, when i try to use "ng-repeat" everything breaks.

as a simple example to demonstrate this issue:

 

OK:
====

<ul kendo-panel-bar>
        <li>TITEL
            <ul>
                <li>
                ​TITEL 2
                    <ul><li>​test 1</li><li>​test 2</li></ul>
                </li>
            </ul>
        </li>
 </ul>​

 

NOT WORKING:

=============

 <ul kendo-panel-bar>
        <li>TITEL
            <ul>
                <li ng-repeat="d in dataSource._data">
                {{d.text}}
                    <ul><li>​test 2</li><li>​test 2</li></ul>
                </li>
            </ul>
        </li>
    </ul>​

 

How can i fix that? I need the dynamic and nested options.

[Helen]

Hello Werner,

You may see a similar discussion here:

http://stackoverflow.com/questions/24283313/kendo-panelbar-with-angularjs-ng-repeat-does-not-render-correctly-on-modifying-d

and a solution here:

http://kendo-labs.github.io/angular-kendo/#/ng-repeat


Regards,
Helen
Telerik

 

 

[Werner Haltner]

Thank you, Helen.

I'll read and try it.
Just to clarify:

I can't use the "Kendo DataSource" to build then panel bar with ng-repeat?

Is this right?

 

Thank you
Werner

[Helen]

Hello Werner,

Generally we don't recommend the using of 'ng-repeat' with kendo controls:

http://docs.telerik.com/kendo-ui/AngularJS/notes-on-ng-repeat

You may try whether the workaround will work for your case.

Regards,
Helen
Telerik

 

 

[Werner Haltner]

hello helen

I'v allready use a datasource. but i'm not use it with the panel bar - i can't build the nested datastructure for the widged. are there a sample available how to use panelbar,angularjs and datasource?

thanks
werner

[Werner Haltner]

ok, meanwhile i found a sample for using the datasource with panelbar.
the problem is solved so far.