Kendo Ui DataSource Schema Model in Typescript
I have a kendo.data.Model in my Angular app that I am converting to Typescript. The DataSource works fine until I add the model definition to the schema.
Is there any other syntax for defining models with DataSource using Kendo Typescript?
Non Typescript version worked fine.
var someModel = new kendo.data.Model({
id: "id",
fields: {
id: { type: "string" },
name: { type: "string", validation: { min: 1, required: true } },
isActive: { type: "boolean" }
}
});
var source = new kendo.data.DataSource({
transport: {
read: (options: any) => {
someService.getData(options.data).then(function (results) {
options.success(results.data);
});
}
},
schema: {
model: someModel
}});
Edit : the problem was that I missed the "define" as in "kendo.data.Model.define ({}). But changing it the problem moved and now I cannot use the typed model in other code:
class Foo {
someModelProp: kendo.data.Model;
constructor() {
this.someModelProp = kendo.data.Model.define({*see above code for fields*});
}
}
I am getting a compilation error on the line "this.someModelProp =":
The type 'typeof Model' is not assigned to the type 'Model'. The '_defaultId' property is missing from the 'typeof Model' type.
I can change "someModelProp" to "any", but then I move away from using typed models and this is contrary to the purpose of Typescript.
source to share
Maybe old, but I was looking for the same questions. If it helps, this works for me:
class Foo extends kendo.data.Model {
private modelDef: typeof kendo.data.Model = kendo.data.Model.define({*see above code for fields*});
private model: kendo.data.Model;
private data: any;
constructor() {
super();
this.model = new this.modelDef([]);
}
init(data: any): Foo {
this.data = data;
this.model = new this.modelDef(data);
return this;
}
// Typescript properties
get _Id(): number { return this.model.get('id'); }
set _Id(value: number) { this.model.set('id', value); }
get _Name(): number { return this.model.get('name'); }
set _Name(value: number) { this.model.set('name', value); }
}
Important: use underscores for typescript properties or runtime error, just prove it and look at the generated JavaScript ...
I hope this helps, and if anyone has a better solution or any comment, thanks in advance!
source to share