CODEWITHSUNDEEP
javascriptjqueryangularjs
The Hawk
The Hawk

Reputation: 1568

jQuery Accordion and Angular JS

I'm trying to make a jQuery accordion from an Angular JS ng-repeat directive. The code doesn't match the example in jQuery UI and it doesn't work. The element with ng-repeat appears to be messing it up. I want h3 as the title and the div below as the content. Repeat for each details.dataset. I've tried without the Ang JS command and it works, so the javascript libraries are loaded correctly.

$(document).ready(function () { $("#myAccordion").accordion(); })

<div id="myAccordion">
    <div class="dockListing" ng-repeat="data in details.dataset">
        <h3>{{data.name}}</h3>
        <div>
            <p><strong>Data 1:</strong>    
                {{data.content}}
            </p>
        </div>
     </div>
</div>

Upvotes: 0

Views: 460

Answers (1)

Abhishek Pachal
Abhishek Pachal

Reputation: 554

here $(document).ready(...) section is loading first and it is arranging whatever it is getting inside the "#myAccordion" div in accordion format.And then the "ng-repeat" is taking place and fetching "details.dataset".So, first make sure "details.dataset" arrives first and then the " **** $("#myAccordion").accordion(); **** " fires.You can use setTimeOut(time) function or any callback function to achieve that.

Upvotes: 2

Related Questions