angular中添加拖动属性

在 Angular 中添加拖动属性，可以使用 Angular CDK 的拖放功能。以下是实现拖动的基本步骤：

1. 导入 Angular CDK 的拖放模块。

import { DragDropModule } from '@angular/cdk/drag-drop';

2. 在模板中设置拖动元素的属性。

<div cdkDrag>
  拖动此处
</div>

3. 设置接受拖动元素的目标区域。

<div cdkDropList (cdkDropListDropped)="onDrop($event)">
  放置此处
</div>

4. 在组件中实现 onDrop 方法，该方法将在拖动元素被拖放时被调用。

onDrop(event: CdkDragDrop<any[]>) {
  // 处理拖放事件
}

以上是添加拖动属性的基本步骤，可以根据实际需求进行更多的配置和自定义。

相关问题

ag-grid-angular Columns禁止拖拽

在Angular中使用ag-Grid-Angular时，如果你想要禁止单元格列的拖拽，你可以通过配置列定义来控制这个功能。ag-Grid允许你为每一列设置属性，包括`sortable`、`resizable`等，来指定它们是否可以排序或调整大小。

以下是阻止列拖拽的步骤：

1. 在你的列定义数组（通常在`gridOptions.columns`中）中，找到你想限制的列，并为它添加一个`sortable`属性并将其值设为`false`。例如：

const gridOptions = {
  columns: [
    { field: 'name', headerName: '姓名', sortable: false },
    { field: 'age', headerName: '年龄', sortable: true },
  ]
};

2. 如果你还想阻止整个行的拖动，可以将`enableColResize`和`enableSorting`都设置为`false`：

gridOptions = {
  enableColResize: false,
  enableSorting: false,
  columns: [...]
};