Javascript 如何在angular js中将一个表行移动到另一个表？

我想通过单击按钮将行移动到另一个表中。 单击向上按钮将第二个表格行移动到第一行，单击向下按钮将第一个表格移动到第二行

在HTML中：

        <table class="table table-striped table-bordered table-hover">
            <thead>
                <tr>
                    <th>Tag Name</th>
                    <th>Status</th>
                    <th></th>
                </tr>
            </thead>
            <tbody>
                <tr ng-repeat="tag in vm.tags | filter: searchBar"
                    ng-init="selectedIndex = $index">
                    <td><span ng-click="vm.editTags(selectedIndex);"
                        tooltip="Click to edit tag">{{tag.name}}</span></td>
                    <td><span ng-click="vm.editTags(selectedIndex);"
                        tooltip="Click to edit tag">{{tag.status}}</span></td>
                    <td><span class="glyphicon glyphicon-remove change-color"
                        ng-click="vm.removeTag(selectedIndex)" tooltip="Delete tag">
                    </span></td>
                </tr>
            </tbody>
        </table>
    </div>

    <div class="top-bottom-padding col-sm-1">
        <button type="button" class="btn change-color bg-white">
            <span class="glyphicon glyphicon-arrow-down glyphicon-lg"></span>
        </button>
    </div>
    <br />
    <div class="top-bottom-padding col-sm-1">
        <button type="button" class="btn change-color bg-white">
            <span class="glyphicon glyphicon-arrow-up glyphicon-lg"></span>
        </button>
    </div>

        <div class="clear pull-right col-sm-1">
          <br/>
            <button ng-disabled="vm.selectedOrder.status == 'Activated'"
                class="pull-left btn btn-primary margin-Left"
                ng-click="vm.editStatus();">Activated</button>
            <button ng-disabled="vm.selectedOrder.status == 'Paused'"
                class="pull-left btn btn-primary margin-Left"
                ng-click="vm.editStatus();">Paused</button>
        </div>
    <div class="clear top-bottom-padding col-sm-1">
        <table class="table table-color table-bordered table-hover">
            <thead>
                <tr>
                    <th>Rotation Order</th>
                    <th>Tag Name</th>
                    <th>Status</th>
                </tr>
            </thead>
            <!-- ng-sortable - External component used for re-arranging rows of table -->
            <tbody ng-sortable="{animation:150}">
                <tr ng-repeat="orders in  vm.rotationTable"
                    ng-class="{selected : orders == vm.selectedOrder}"
                    ng-click="vm.setSelected(orders)">
                    <td>{{orders.rotationOrder}}</td>
                    <td>{{orders.tagName}}</td>
                    <td>{{orders.status}}</td>
                </tr>
            </tbody>
        </table>
</div>

---

您可以在此处看到mu代码：

将项目从vm.tags移动到顶部的vm.rotationTable

var selectedIndex = 0;// or any valid index from vm.tags
vm.rotationTable.splice(0, 0, vm.tags.splice(selectedIndex, 1)[0]);

将项目从vm.rotationTable移动到底部的vm.tags

var selectedIndex = 0;// or any valid index from vm.rotationTable
vm.tags.splice(vm.tags.length - 1, 0, vm.rotationTable.splice(selectedIndex, 1)[0]);

---

你所说的移动是什么意思？数据在每个数组中具有不同的结构。如果它们是相同的结构，这将是微不足道的。移动意味着从第一个表中选择一行，然后单击箭头发送到另一个表的末尾，反之亦然。是的，如果可能，我们可以向标记表添加id以保持相同的数据结构。感谢您的回答，但它没有按我想要的方式工作。我希望选择一行，然后单击箭头它最终将移动到下一张桌子。@Pallavi您需要集成到任何活动中。这不是一个代码编写服务。答案是告诉你怎么做。你认为我没有试过吗？它的错误就在我的逻辑中。我知道它不是代码编写服务。我不是要求写代码。我只是要求帮助我理解逻辑。

var selectedIndex = 0;// or any valid index from vm.rotationTable
vm.tags.splice(vm.tags.length - 1, 0, vm.rotationTable.splice(selectedIndex, 1)[0]);

in html:-
<button type="button" class="btn change-color bg-white" ng-click="vm.moveRight();">
  <span class="glyphicon glyphicon-arrow-right  glyphicon-lg"></span>
 </button>

<button type="button" class="btn change-color bg-white" ng-click="vm.moveLeft();">
    <span class="glyphicon glyphicon-arrow-left  glyphicon-lg"></span>
</button>

vm.moveRight = function () {
             var selectedIndex = vm.selectedTag;
              vm.rotationTable.push(vm.selectedTag);
              vm.tags.splice(index,1);
             };

      vm.moveLeft = function () {
          var selectedIndex = vm.selectedOrder;// or any valid index from vm.tags
          vm.tags.push(vm.selectedOrder);//({ name: vm.tagsData.name, status: vm.tagsData.status });
          vm.rotationTable.splice(index, 1);
      };