Angular 带形状的角阻力降

我有两个数组。我正在实现一个角度拖放，我想使用FormArray保存元素被拖放到的数组

问题是我无法将formcontrol应用于div，因为它会给出一个错误

错误：名称为“language”的窗体控件没有值访问器

这是html

选定语言
{{item}}
可用语言
{{item}}
saveButtonLabel

目前，我们无法使用带有角度拖放的formControl，因为它与div一起工作，并且我们无法向其添加formControl。因此，我们需要使用事件cdkDropListDropped来在每次删除项目时手动更新我们的模型

角度材质拖放API具有moveItemInArray函数，如图所示

这只支持常规阵列，但根据pierNik的回答，您可以使用以下功能复制FormArray的功能：

import { FormArray } from '@angular/forms';

/**
 * Moves an item in a FormArray to another position.
 * @param formArray FormArray instance in which to move the item.
 * @param fromIndex Starting index of the item.
 * @param toIndex Index to which he item should be moved.
 */

export function moveItemInFormArray(
  formArray: FormArray,
  fromIndex: number,
  toIndex: number
): void {
  const dir = toIndex > fromIndex ? 1 : -1;

  const item = formArray.at(fromIndex);
  for (let i = fromIndex; i * dir < toIndex * dir; i = i + dir) {
    const current = formArray.at(i + dir);
    formArray.setControl(i, current);
  }
  formArray.setControl(toIndex, item);
}

从'@angular/forms'导入{FormArray}；
/**
*将表格中的项目移动到另一个位置。
*@param formArray formArray实例，在其中移动项目。
*@param fromIndex是项的起始索引。
*@param toIndex应将项目移动到的索引。
*/
导出函数MoveItemInformary(
福尔雷：福尔雷，
fromIndex:number，
toIndex:编号
)：无效{
const dir=toIndex>fromIndex？1:-1；
const item=formArray.at（fromIndex）；
for（设i=fromIndex；i*dir

然后在调用代码中传递formArray代替普通数组

get formControls(): FormArray {
    return this.form.get('arrayName') as FormArray;
}

constructor() {
    this.form = this.formBuilder.group({
      arrayName: this.formBuilder.array([]),
    });
}

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

get formControls（）：FormArray{
将此.form.get（'arrayName'）作为FormArray返回；
}
构造函数（）{
this.form=this.formBuilder.group({
arrayName:this.formBuilder.array（[]），
});
}
drop（事件：CdkDragDrop）{
移动项目信息阵列(
这个.formControls，
event.previousIndex，
event.currentIndex
);
}

---

请参阅working Stackblitz

一篇可能会解决您的问题的有用帖子：如果您仍然需要帮助，是否也可以发布您的组件代码？似乎问题可能与在

上使用

formControlName=“language”

有关。

get formControls(): FormArray {
    return this.form.get('arrayName') as FormArray;
}

constructor() {
    this.form = this.formBuilder.group({
      arrayName: this.formBuilder.array([]),
    });
}

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