The Idea

We're trying to allow a user to paste a single row or column of data (in our use case, integers) that they've copied from an excel or google spreadsheet into a single column of inputs in our data table. If they paste into an input, we want to populate that input and the inputs beneath it with the corresponding values from the pasted data.

This would essentially feel like copying a column/row from an excel spreadsheet and pasting it into one of our data table columns as you would expect that copied data to paste into any other spreadsheet.

The Problem

When the user pastes, we've been able to fetch and parse the pasted data via a JQLite $event object, and have put those data values into an array bound to our template's controller. Then we iterate over the rows whose inputs should be changing, and assign the new values to the correct 'ng-model' property for that row's input. The problem is that it seems like the ng-paste function is executing before the pasted data gets bound to the initial input model, so when we change that first model within our loop, it gets overwritten (or something). Basically, the initial input holds the pasted data instead of the value that we wrote to the model.

Plunk

Here: https://embed.plnkr.co/Vt2jDiF7pVmrbYpuoz0E/ TO TEST: Any set of values delimited by spaces, commas, new lines, carriage returns, or tabs should work with our code. Copy this line: 5.3245,6234.3443,95.2453,10.2594 and paste it into one of the inputs to see how it breaks.

Solution

The solution:

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

ev.preventDefault()
    return;

The above snippet prevents the actual paste action from happening.