Drag and drop sortable ng:repeats in AngularJS?

javascript angularjs jquery-ui-sortable
Nick Retallack picture Nick Retallack · Sep 8, 2011 · Viewed 81.2k times · Source

Is it at all easy to use jQuery.sortable on ng-repeat elements in AngularJS?

It would be awesome if re-ordering the items automatically propagated that ordering back into the source array. I'm afraid the two systems would fight though. Is there a better way to do this?

Answer

Guillaume86 picture Guillaume86 · Aug 12, 2012

Angular UI has a sortable directive,Click Here for Demo

Code located at ui-sortable, usage:

<ul ui-sortable ng-model="items">
  <li ng-repeat="item in items">{{ item }}</li>
</ul>

Related questions

"Thinking in AngularJS" if I have a jQuery background?

Suppose I'm familiar with developing client-side applications in jQuery, but now I'd like to start using AngularJS. Can you describe the paradigm shift that is necessary? Here are a few questions that might help you frame an answer: How do …

Read More
AngularJS passing data to $http.get request

I have a function which does a http POST request. The code is specified below. This works fine. $http({ url: user.update_path, method: "POST", data: {user_id: user.id, draft: true} }); I have another function for http GET and …

Read More
Insert HTML into view from AngularJS controller

Is it possible to create an HTML fragment in an AngularJS controller and have this HTML shown in the view? This comes from a requirement to turn an inconsistent JSON blob into a nested list of id: value pairs. Therefore …

Read More