如何将一个数组项转移到另一个数组并使用Angular Material更新它拖放CDK而不将这两个数组项绑定到同一个参数

在Angular中，可以使用Angular Material和CDK提供的拖放功能来实现将一个数组项转移到另一个数组并更新视图的效果。下面是一个示例代码：

首先，安装Angular Material和CDK库：

npm install @angular/material @angular/cdk

然后，在你的Angular组件中引入必要的模块和服务：

import { Component } from '@angular/core';
import { CdkDragDrop, moveItemInArray, transferArrayItem } from '@angular/cdk/drag-drop';

@Component({
  selector: 'app-example',
  templateUrl: './example.component.html',
  styleUrls: ['./example.component.css']
})
export class ExampleComponent {
  sourceArray: any[] = [1, 2, 3, 4, 5];
  targetArray: any[] = [];

  drop(event: CdkDragDrop<any[]>) {
    if (event.previousContainer === event.container) {
      moveItemInArray(event.container.data, event.previousIndex, event.currentIndex);
    } else {
      transferArrayItem(event.previousContainer.data, event.container.data, event.previousIndex, event.currentIndex);
    }
  }
}

在上面的代码中，sourceArray是源数组，targetArray是目标数组。在drop方法中，我们检查拖放事件的previousContainer和container，如果它们是同一个容器，我们使用moveItemInArray方法将数组项移动到新位置；如果它们不是同一个容器，我们使用transferArrayItem方法将数组项从一个容器转移到另一个容器。

接下来，在组件的模板文件中使用Angular Material的拖放指令和CDK提供的cdkDropList、cdkDrag和cdkDropListConnectedTo来实现拖放功能：

<div cdkDropList [cdkDropListData]="sourceArray" (cdkDropListDropped)="drop($event)">
  <div class="item" *ngFor="let item of sourceArray" cdkDrag>{{ item }}</div>
</div>

<div cdkDropList [cdkDropListData]="targetArray" (cdkDropListDropped)="drop($event)">
  <div class="item" *ngFor="let item of targetArray" cdkDrag>{{ item }}</div>
</div>

在上面的代码中，我们使用cdkDropList指令来定义一个可拖放的容器，并使用cdkDropListData绑定对应的数组数据。在每个容器中，使用cdkDrag指令来定义可拖放的元素，并使用*ngFor指令循环显示数组中的每个项。

最后，添加一些基本的样式来显示拖放效果：

.item {
  width: 100px;
  height: 100px;
  background-color: lightblue;
  margin: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
}

以上就是将一个数组项转移到另一个数组并使用Angular Material更新它拖放CDK的方法。在实际应用中，你可以根据具体场景对代码进行适当调整和扩展。更多关于Angular Material和CDK的详细信息，请参考腾讯云的Angular Material文档。