angularjs 使用angular-sortable-view实现拖拽效果（包括拖动完成后的方法使用）

首先还是看效果图吧，方便大家可以快速得知是否是自己需要的功能：(抱歉电脑还未安装动图软件，先用.png)

 

 

如果上图是你需要的功能效果图，那么请往下看，我有写出来例子哦~

使用这个插件有几个好处，首先：

1.只需要额外引入一个依赖包。angular-sortable-view.js即可

2.

核心代码：

    <div ng-controller="MyController as vm" class="background">
        <div sv-root sv-part="vm.items" class="sv-container">
            <div ng-repeat="item in vm.items" sv-element class="sv-cell">
                <div>
                    <div>name: {{item.name}}</div>
                    <div>value: {{item.age}}</div>
                </div>
                <span class="sv-handle" sv-handle>拖拽手柄</span>
            </div>
        </div>
        <hr/>
        <div class="show-data">
            {{vm.items}}
        </div>
    </div>

 

3.

一个重点常用的API

API:

sv-on-sort="foo($item, $partFrom, $partTo, $indexFrom, $indexTo)"

 

 

 本案例代码：代码传送门：https://github.com/zhongqiulan/angular-sortable-view

注：有完整代码哦

官方文档，建议大家遇到瓶颈的时候无意识浏览浏览：

 

地址：

 https://github.com/kamilkp/angular-sortable-view