Loading new data into DataSource breaks Angular data bindings

2 posts, 0 answers
  1. Chad
    Chad avatar
    10 posts
    Member since:
    Oct 2015

    Posted 18 Jan Link to this post

    I created a demo here: 

    http://dojo.telerik.com/@cglendenin/aJuLe/3

    When you first run it, if you click in the Category column of the grid, you get a dropdown list to change the category value. If you choose a different value in the first row, you can see it reflected immediately in the text above the grid. That works via AngularJS's standard data binding: `First product's category: {{ products[0].Category }}`

    If you click the "Change Data" button, it runs a function that calls `dataSource.data([/* different array with new data... */])`, which changes the data in the grid. That works as expected. However, after this point, the dropdown list can no longer change the data. I assume that is because, when the dropdown list is initialized, it captures a reference to the original grid data, and calling dataSource.data([...]) makes the DataSource hold a reference to a new object?

    Is there a workaround for this problem? Thanks!

  2. Nikolay Rusev
    Admin
    Nikolay Rusev avatar
    2285 posts

    Posted 21 Jan Link to this post

    Hello Chad,

     

    You must change the products reference in the $scope too when changing DataSource data.

     

    $scope.products = newProducts;

     

    Updated example - http://dojo.telerik.com/@rusev/aDIBI

     

    Regards,
    Nikolay Rusev
    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
Back to Top