Angular 类型'；事件'；类型'；中缺少以下属性；CdkDragDrop<；字符串[]，字符串[]>'；

我在看斯塔克闪电战

特别是我看到了html

<table mat-table
       [dataSource]="dataSource" 
       cdkDropList
       cdkDropListOrientation="horizontal"
       (cdkDropListDropped)="drop($event)">

我已经在MytableComponent中定义了drop

export class MytableComponent implements AfterViewInit {
  @ViewChild(MatPaginator) paginator!: MatPaginator;
  @ViewChild(MatSort) sort!: MatSort;
  @ViewChild(MatTable) table!: MatTable<MytableItem>;
  dataSource: MytableDataSource;

  /** Columns displayed in the table. Columns IDs can be added, removed, or reordered. */
  displayedColumns = ['id', 'name', 'dateOfBirth'];

  drop(event: CdkDragDrop<string[]>) {
    moveItemInArray(this.displayedColumns, event.previousIndex, event.currentIndex);
  }

  constructor() {
    this.dataSource = new MytableDataSource();
  }

  ngAfterViewInit(): void {
    this.dataSource.sort = this.sort;
    this.dataSource.paginator = this.paginator;
    this.table.dataSource = this.dataSource;
  }
}

导出类MytableComponent实现AfterViewInit{
@ViewChild（MatPaginator）paginator！：MatPaginator；
@ViewChild（MatSort）排序！：MatSort；
@ViewChild（MatTable）表格！：MatTable；
数据源：MytableDataSource；
/**表中显示的列。可以添加、删除或重新排序列ID*/
displayedColumns=['id'，'name'，'dateOfBirth']；
drop（事件：CdkDragDrop）{
moveItemInArray（this.displayedColumns、event.previousIndex、event.currentIndex）；
}
构造函数（）{
this.dataSource=新的MytableDataSource（）；
}
ngAfterViewInit（）：void{
this.dataSource.sort=this.sort；
this.dataSource.paginator=this.paginator；
this.table.dataSource=this.dataSource；
}
}

生成失败并出现错误

Error: src/app/mytable/mytable.component.html:5:35 - error TS2345: Argument of type 'Event' is not assignable to parameter of type 'CdkDragDrop<string[], string[]>'.
  Type 'Event' is missing the following properties from type 'CdkDragDrop<string[], string[]>': previousIndex, currentIndex, item, container, and
3 more.

错误：src/app/mytable/mytable.component.html:5:35-错误TS2345:类型为“Event”的参数不能分配给类型为“CdkDragDrop”的参数。
类型“Event”缺少类型“CdkDragDrop”中的以下属性：previousIndex、currentIndex、item、container和
还有3个。

也许我在项目的初始设置中设置了比示例更严格的类型检查

经过一番搜查，我看到了

  drop(event: Event)  {
      if (isDragDrop(event)) {
        moveItemInArray(this.displayedColumns, event.previousIndex, event.currentIndex);
      }
    }

当我声明

function isDragDrop(object: any): object is CdkDragDrop<string[]> {
  return 'previousIndex' in object;
}

app.component.html中的用法

  <h3>My Table Rowss</h3>
  <app-mytable ID="MyTable1"></app-mytable>

My Table Rowss

  <h3>My Table Rowss</h3>
  <app-mytable ID="MyTable1"></app-mytable>