Slice with Nested Observable Array

6 posts, 0 answers
  1. Joe
    Joe avatar
    11 posts
    Member since:
    Jan 2014

    Posted 07 May 2014 Link to this post

    I am trying to use the slice method on my Observable Array.  Each item in my array has another observable array.  The slice works great, as the objects returned are prefect "copies", but the Observable Arrays in each object are not copied, and therefor still reference the observable array from the item it was copied from.  How can I do a true deep copy for my items with any nested items that item may have?


    Thanks and sorry if this sounds confusing.  
  2. Atanas Korchev
    Admin
    Atanas Korchev avatar
    8462 posts

    Posted 09 May 2014 Link to this post

    Hi Joe,

    Could you please show us the code that you are using and the objects that contain those arrays?

    Regards,
    Atanas Korchev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Kendo UI is VS 2017 Ready
  4. Joe
    Joe avatar
    11 posts
    Member since:
    Jan 2014

    Posted 09 May 2014 in reply to Atanas Korchev Link to this post

    My objects are really large and complex, but I'll do my best to summarize.  I know th following code is not syntatically correct, but I hope you get the idea. If I were to run something like the following, I would expect to get a "copy" of my sub item from group 2 and then have that "copy" be altered an then pushed to group 1's sub items.  The problem I'm seeing is that when I alter my sliced subitem it is not a real copy and thus when I alter it, it is changing the original array item that was sliced.  I have gotten around this by stringifying my sliced object, parsing it, and then pushing it into my observable array.

    Thanks for the help. 

    viewModel = kendo.observable({
       groups: arrayOfGroups
    });
     
    arrayOfGroups = [
      {item : { key : 'item 1', items : [{ key : 'sub item 1'}]},
      {item : { key : 'item 2', items : [{ key : 'sub item 2'}, { key : 'sub item 3}]}
    ]
     
    var subItem2 = viewModel.get('groups[1]').items.slice(0,1);
    subItem2.key = 'new sub item';
    viewModel.get('groups[0]').items.push(subItem2);
  5. Atanas Korchev
    Admin
    Atanas Korchev avatar
    8462 posts

    Posted 09 May 2014 Link to this post

    Hi Joe,

    Indeed the slice method won't copy the ObservableArray. You can however clone it like this:

    var clone = new kendo.data.ObservableArray(original.toJSON());


    Regards,
    Atanas Korchev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  6. Joe
    Joe avatar
    11 posts
    Member since:
    Jan 2014

    Posted 09 May 2014 in reply to Atanas Korchev Link to this post

    I wasn't expecting to copy the observable array, I was trying to take a slice from an obsevable array, but to your point my bigger issue is probably that the child observable array is not being "copied".

    Thanks for the reply. 
  7. Atanas Korchev
    Admin
    Atanas Korchev avatar
    8462 posts

    Posted 09 May 2014 Link to this post

    Hello Joe,

    I guess I still don't understand the issue. Could you please try reproducing it in http://trykendoui.telerik.com ? Once I have some working code I can suggest a workaround or solution.

    Regards,
    Atanas Korchev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
Back to Top
Kendo UI is VS 2017 Ready