任何人都有一些代码可以使用不需要jQuery的拖放重新排序ng-repeat? (仅限angularjs依赖)
答案 0 :(得分:24)
我在https://github.com/kamilkp/angular-sortable-view取得了不错的成绩 - 它是全新的(第一次提交是周!),但它非常容易与...合作。您在元素(可能是sv-root
)上放置了div
属性,该元素是您希望能够重新排序的ng-repeat
的祖先。然后,您将sv-element
属性放在您ng-repeat
的任何元素上,然后为您处理拖放。
您还可以选择在sv-handle
内的某个元素(可能是图像或Font Awesome图标)上放置ng-repeat
属性,在这种情况下,该元素将用作拖动控制柄。您还可以选择设置"占位符" (拖动时显示拖动元素的位置,如果你现在放下它的位置),在占位符的任何元素上都有sv-placeholder
属性。最后,您可以选择在某个元素上指定sv-helper
属性,以使该元素成为被拖动的元素。 (因此,如果你希望用户在拖动时看到的东西需要与他们在列表中看到的东西不同,那就是你如何做到的。)
哦,sv-placeholder
和sv-helper
属性都可以在元素外面 ng-repeat,在这种情况下,每个拖动都会使用相同的元素情况(例如,使用这个,如果你想要一个空白的灰色框作为占位符,就像Trello在你拖动卡片时那样) - 或者这些属性可以在元素里面 ng-repeat ,在这种情况下,您可以访问该特定ng-repeat元素的局部范围(例如,如果您希望占位符为"我拖动的文本,不透明度,请使用此元素) 50%,围绕它的虚线边框")。
来自https://github.com/kamilkp/angular-sortable-view回购链接的演示很好地证明了这一用法,所以不要再多说一点,我只是让你在演示中逛一逛。到目前为止,我的个人经历非常有利。
哦,它除了Angular之外没有依赖关系。没有jQuery或其他任何需要。