Splicing new array of items onto existing Knockout observable array causes binding errors
knockout.js
Solution
You try to pass the `contactData2` as the third parameter of `Array.splice` but `Array.splice` does not support an array as the third parameter. See also in documentation.
So you need to write something like
vmContacts.Contacts.splice(vmContacts.Contacts().length, 0,
contactData2[0], contactData2[1], contactData2[2], contactData2[3]);
Or you can use `push` together with `apply` in order to "join" your two arrays:
vmContacts.Contacts.push.apply(vmContacts.Contacts,contactData2);
Demo JSFiddle.
Problem
I have a knockout observable array being populated with some initial values when the web page loads, and I want to add to the observable array via splice method as the user interacts with the page. The new items I'm trying to add to the array have the exact same properties as the original items in the array, but when I try to splice the new items onto the existing array, I get a Knockout binding error, ex: "Error: Unable to parse bindings. Message: ReferenceError: ContactName is not defined; Bindings value: text: ContactName". This error occurs even though the property in question does exist on all the items in the new array. I'm trying to do the splice on the Knockout observable array, not the underlying array object, because I want the bindings to update automatically. The splice code looks like this: `vmContacts.Contacts.splice(vmContacts.Contacts().length,0,contactData2);`. I created a fiddle example here so you can see it in action: http://jsfiddle.net/ak47/pMFwe/. You'll see the error in the browser console when you click the Add Contacts button. I'd like to avoid looping through the array of new objects to do a push() for each item I need to add, that's where a splice should work, but it's not. Is this a known issue in Knockout or am I doing something wrong? Thanks for the help!