Question

我有一个看起来像这样的HTML代码。我想在这些行（表数据）上应用DRAG和DROP功能。

<table>
   <tr class="table-header">
      <th>Title</th>
      <th>Name</th>
      <th>Modified By</th>
      <th>Date</th> 
   </tr>
   <tr class="table-data" ng-repeat="item in items">
      <td>item.title</td>
      <td>item.name</td>
      <td>item.modifiedByName</td>
      <td>item.modifiedDate</td>
   </tr>
</table>

在我的ANGULAR JS控制器中，ITEMS数组的格式如下

$scope.items = [
        {
           title: "string"
           name: "string"
           modifiedByName: "string"
           modifiedDate: "string"
           defaultOrder: 1
        },
        {
           title: "string"
           name: "string"
           modifiedByName: "string"
           modifiedDate: "string"
           defaultOrder: 2
        },
        {
           title: "string"
           name: "string"
           modifiedByName: "string"
           modifiedDate: "string"
           defaultOrder: 3
        },
        {
           title: "string"
           name: "string"
           modifiedByName: "string"
           modifiedDate: "string"
           defaultOrder: 4
        }
]

Angular JS版本-1.5.8

需要根据“ defaultOrder”参数显示行。
一旦用户使用拖放功能更新了自己的偏好设置，默认订单就会得到更新，然后相应地发送到服务器。

Answer 1

Angular JS团队提供了一个指令（库）来实现上述功能。

下面是github链接。

https://github.com/angular-ui/ui-sortable

实现拖放，对行进行垂直排序

1 个答案: