Hello. My company recently purchased the igniteUI product and I have a grid directive up and running but the data binding is not working as expected.
First, I expected to be able to just say "ng-model="myDataSource"" and have it bind but that didn't work.
So I have implemented the grid in markup as "<div ig-grid="gridOptions" id="gridMyGrid"></div>"
In my controller I set the options object including the dataSource property "dataSource: $scope.myDataSource" Then in the controller I load myDataSource asynchronously, but the grid does not update with the data.
So then I have to hard code that into the callback "$("#gridMyGrid").igGrid("option", "dataSource", $scope.myDataSource);" to get the grid to update. This is not what I would call data binding.
Then if I use the grid UI to add a row all the other rows disappear and all I see is the added row. I haven't yet figured out how to reference the grid's datasource in js but I'm willing to bet that $scope.myDataSource isn't getting updated.
Any advice on how to get data binding to work is much appreciated.
Thanks
Hello Jeff,
When configuring your igGrid in the controller you need to change the "dataSource" property in the grid options in order to achieve two-way data binding. For example in your case you need to do something like this:
$http.get("/api/values").then(function (r) {
$scope.gridOptions.dataSource = r.data;
});
This is because we internally observe(watch) this reference.
Best regards,Martin PavlovInfragistics, Inc.
Yep that answered 3 questions really. Got the data binding working, got the add record feature working, and explained how to access the grid's data source in js.