undefined new items appear while reordering a list with ui-sortable and angularJS

Question

I'm using ui-sortable with AngularJS to reorder a list. I don't want the elements to change at all (none added, removed or altered). During sorting, sometimes new undefined elements appear and create various problems with my other code. I couldn't find any discussion of this issue, or any examples about how to control it.

It seems like the accept properties of the droppable might be involved, but I'm not sure where to go from there. Any solutions or explanations would be very helpful.

Here's the code:

<div ui-sortable ng-model="topicsList">
    <p class="input-group" ng-repeat="topic in topicsList" style="padding:5px 10px; cursor: move;"> 
        <p>Other stuff</p>
        <input type="checkbox" ng-model="topic.selected">
        {{topic.name}}
    </p>
</div>

Answer 1

I reread the angular docs (for ui-sortable, I think), which mention that you can't have anything inside the ui-sortable element other than the ng-repeat element, so the paragraph element with "other stuff" seems to have been causing the problem. Once I removed it, it seems to work fine.