angular - 如何在两个不同的表之间存储一行的拖动选项元素
问题描述
我有两个tables
由不同的 ngFor 循环生成的不同名称。我曾经在不同的列表cdkDrag
之间拖动它们。这有效,但我的问题是当我在下拉列表中设置选项并将其拖动到另一个列表时,它消失了,如下所示图片
下面我将选项从奥迪更新为萨博(这里没问题)
当我尝试从Done
具有新Saab
选项的列表中拖动该行到ToDo
列表时,所选选项在下图中消失
下面是我的 stackblitz 示例。如果你能帮助我,我会很高兴
https://stackblitz.com/edit/angular-gbls7d?file=src/app/cdk-drag-drop-connected-sorting-example.html
解决方案
您需要保存选定的选项。例如,向您的对象添加一个属性以存储选项,然后从选择中绑定到此选项(示例中的属性名称为“已选择”):
<select id="cars" [(ngModel)]="feed.selected">
ts 列表:添加到每个对象(:
{name:"Example",num:2,char:"4",length:"5",difficulty:"easy", selected
: null},
{name:"Example1",num:2,char:"4",length:"5",difficulty:"easy", selected
: null}
//etc
当您循环提要对象时,它会将每个相应的选择绑定到当前对象中的该属性。
StackBlitz 示例基于您的。
推荐阅读
- bluetooth - 如何“预配对”蓝牙?
- c++ - 已删除文件夹的 FindFirstChangeNotification
- pyspark - 如何根据每日指标计算一系列状态?
- r - 使用glue_sql() 并避免粘贴在动态SELECT 语句中的方法?
- xapi - 将 xAPI 语句发送到 LRS
- arrays - 寻找示例 JavaScript 代码来验证字符串数组(混合文本和数字)是否按升序 (A-->Z) 顺序排列
- powershell - 带有多个项目的数组的 ConvertTo-Json
- javascript - 在 UseEffect 中设置状态后如何更新状态?
- javascript - collector.on 'collect' 事件与按钮行,不和谐的 js 按钮
- c++ - 如何在不拒绝 C++ 中的读取或执行访问的情况下保护文件