TreeView, TypeScript and Model Classes

[Daniel]

Hi,

I'm using in my new project telerik kendo controls with angularjs, furthermore I want to use TypeScript.
This combination looks really good, but now I have following problem.

I have a hierarchical datasource for a treeview. The datasource is populated with my own javascript model class.
​

01.module MyNamespace {
02.    'use strict';
03.
04.    export class Cluster {
05.        public clusters: Cluster[];
06.        public parentId: string;
07.        public dateCreated: Date;
08.        public dateModified: Date;
09.
10.        constructor(
11.            public id: string,
12.            public matrixId: string,
13.            public name: string,
14.            public position: number
15.            ) {
16.
17.            this.clusters = [];
18.            this.dateCreated = new Date();
19.            this.dateModified = new Date();
20.        }
21.    }
22.}

If I try to get the selected node item, I get following typescript error:

            Build: Cannot convert 'kendo.data.Node' to 'MyNamespace.Cluster'


The problem is, that .dataItem returns a node object and not my model class. If i try to cast the return value, i get this error:

          Error: Cannot convert 'kendo.data.Node' to 'MyNamespace.Cluster': Type 'kendo.data.Node' is missing property 'clusters' from type 'MyNamespace.Cluster'. Type 'MyNamespace.Cluster' is missing property 'children' from type 'kendo.data.Node'



How can i get off this error?

Regards
Daniel

[Alex Gyoshev]

Hello Daniel,

Since the TreeView is working with Node instances, you should be able to make the cast if the Cluster class extends the kendo.data.Node class:

class Cluster extends kendo.data.Node

Regards,
Alex Gyoshev
Telerik

 

 

[Daniel]

Hi Alex,

thanks for the quick Response. That helps me a lot.

Regards
Daniel

[Daniel]

Hi Alex,

after extending my model class I have another problem.
It is all ok with TypeScript compiling, but now the TreeView doesn't show any children more :(

Regards
Daniel

[Alex Gyoshev]

Hello Daniel,

It is likely that you will need to call the Node constructor from yours, or that you'll need to set the hasChildren flag accordingly. If neither of these appear to help, please provide a runnable sample so that we can reproduce the issue.

Regards,
Alex Gyoshev
Telerik