CODEWITHSUNDEEP
angularjsdata-bindingkendo-uikendo-grid
julius_am
julius_am

Reputation: 1527

Use angular binding with kendo grid templates

I use kendo ui grid with angular. I want the grid to be updated with every change in the array (of any property). Meaning, if my data is:

this.rowData = [{ id: "1",  name: "A", age: "16" }, { id: "2", name: "B", age: "42" }];

and the age is changed from 16 to 17 I want the grid to be updated automatically.

I understand that I can use ObservableArray and when updating the observable the grid will be updated but I don't want the entire application to know the observable. I want to be able to update the original rowData and affect the grid. Any suggestions of how I do that?

I thought that adding a template to a row or a specific column with angular binding will help but it didn't, here is an example of it:

function Controller(GridConstants) {
    this.rowData = [{ id: "1",  name: "A", age: "16" }, { id: "2", name: "B", age: "42" }];
    this.gridDataSource = new kendo.data.DataSource({
        data: new kendo.data.ObservableArray(this.rowData),
        schema: {
            model: { id: "id" }
        }
    });

    this.gridOptions = {
        dataSource: this.gridDataSource,
        selectable: "row",
        columns: [
                    {
                        field: "name",
                        title: "Name"
                    },
                    {
                        field: "age",
                        title: "Age",
                        template: "<label>{{dataItem.age}}</label>"
                    }
        ],
        selectable: "single"
    };
}

Upvotes: 0

Views: 2481

Answers (2)

Cyclion
Cyclion

Reputation: 774

var rowDataObservable =  new kendo.data.ObservableArray(this.rowData);

... data: rowDataObservable, ... //and you need work with rowDataObservable, this will work

rowDataObservable[0].age = 17;

Upvotes: 0

Matt Holcomb
Matt Holcomb

Reputation: 151

You can try ng-bind instead:

template: "<label ng-bind='dataItem.age'></label>"

Upvotes: 1

Related Questions