单击向上和向下按钮重新排序垫列表行

Question

我需要通过点击每行上的箭头按钮来上下移动 Mat List 行。不需要使用带 cdk/drag-drop 的拖放选项，但仅使用按钮即可完成。是否有任何包可用于此，或者我是否需要为此实现逻辑，例如更新数组序列以反映这一点。

在不使用拖放的情况下完成此操作的最佳方法是什么？

Answer 1

我做了一个 stackblitz 应该可以解决你的问题：https://stackblitz.com/edit/angular-om9pgk?file=src/app/table-dynamic-observable-data-example.ts

您只需要在 mat-table 中添加另一个 Column，它包含用于在列表中向上或向下移动列表元素的按钮。每个按钮都应该有一个点击处理程序，具有将给定元素在列表中向上或向下交换一个位置的功能，请参阅我的 stackblitz 示例中的函数 moveUp 和 moveDown。