I'm currently working on setting up a Kendo Grid in Angular. Initially, my setup looked something like this:
<div kendo-grid k-options="gridOptions" k-data-source="myArray"></div>
Within my scope, myArray is a dynamically assigned array. The gridOptions object was initially defined as follows:
gridOptions = {
dataSource: {
sort: { field: "number", dir: "asc" }
},
columns: [
{ field: "number", title: "Number" }
],
sortable: true
};
The issue here is that the default sorting is being overlooked, likely because Kendo is prioritizing the k-data-source over the options provided. However, after attempting to remove k-data-source and modify gridOptions to:
gridOptions = {
dataSource: {
data: myArray,
sort: { field: "number", dir: "asc" }
},
columns: [
{ field: "number", title: "Number" }
],
sortable: true
};
I observed that the grid does get sorted, but upon assigning myArray, the grid fails to populate with the data (resulting in an empty grid).
What would be the most effective approach for achieving a default sorted grid using Kendo Angular directives? Thank you