粘贴操作会覆盖Ng-Paste中的更新输入模型

时间:2017-10-18 15:14:48

标签: javascript angularjs angular-ngmodel ng-paste

我们的工具:AngularJS 1.5.11 w / Angular Material v?

想法

我们正在尝试允许用户将他们从excel或Google电子表格中复制的单行或一列数据(在我们的用例中,整数)粘贴到一列输入中我们的数据表。如果它们粘贴到输入中,我们希望使用粘贴数据中的相应值填充该输入及其下方的输入。

这基本上就像复制excel电子表格中的列/行并将其粘贴到我们的数据表列之一,就像您希望将复制的数据粘贴到任何其他电子表格中一样。

问题

当用户粘贴时,我们已经能够通过JQLite $事件对象获取和解析粘贴的数据,并将这些数据值放入绑定到模板控制器的数组中。然后我们迭代输入应该改变的行,并将新值分配给正确的' ng-model'该行输入的属性。问题是,在粘贴的数据绑定到初始输入模型之前,似乎ng-paste函数正在执行,所以当我们在循环中更改第一个模型时,它会被覆盖(或者某些东西)。基本上,初始输入保存粘贴的数据,而不是我们写入模型的值。

普拉克

此处:https://embed.plnkr.co/Vt2jDiF7pVmrbYpuoz0E/ 测试:由空格,逗号,换行符,回车符或制表符分隔的任何值都应该与我们的代码一起使用。复制此行: 5.3245,6234.3443,95.2453,10.2594 并将其粘贴到其中一个输入中以查看它是如何中断的。

1 个答案:

答案 0 :(得分:0)

解决方案:

https://plnkr.co/edit/KjA1gnQj6JYbxFswLQjd?p=preview

ev.preventDefault()
    return;

以上代码段可防止实际的粘贴操作发生。