Kendo ui 如何使来自Kendo数据源离线存储的getItem方法与LocalFow一起工作
我需要设置我的数据源以使用LocalFower来管理我的脱机数据存储 我遇到的问题是LocalFower本质上是异步的,只允许我们使用回调或承诺来检索数据 以下是我的代码的设置方式:Kendo ui 如何使来自Kendo数据源离线存储的getItem方法与LocalFow一起工作,kendo-ui,kendo-datasource,localforage,Kendo Ui,Kendo Datasource,Localforage,我需要设置我的数据源以使用LocalFower来管理我的脱机数据存储 我遇到的问题是LocalFower本质上是异步的,只允许我们使用回调或承诺来检索数据 以下是我的代码的设置方式: (function () { 'use strict'; var serviceId = 'employeeDataSource'; angular.module('app').factory(serviceId, function () { var crudService
(function () {
'use strict';
var serviceId = 'employeeDataSource';
angular.module('app').factory(serviceId, function () {
var crudServiceBaseUrl = 'Data/Employees';
var dataSource = new kendo.data.DataSource({
type: "odata",
offlineStorage: {
getItem: function () {
localforage.getItem('employees-key').then(function (value) {
console.log(value);
return JSON.parse(value);
});
},
setItem: function (item) {
if (item.length > 0) {
localforage.setItem("employees-key", JSON.stringify(item));
}
}
},
transport: {
read: {
url: crudServiceBaseUrl + "/",
dataType: "json"
},
update: {
url: function (data) {
return crudServiceBaseUrl + "(guid'" + data.EmployeeId + "')";
}
},
create: {
url: crudServiceBaseUrl
},
destroy: {
url: function (data) {
return crudServiceBaseUrl + "(guid'" + data.EmployeeId + "')";
}
}
},
batch: false,
pageSize: 5,
serverPaging: true,
schema: {
data: function (data) {
return data.value;
},
total: function (data) {
return data['odata.count'];
},
model: {
id: "EmployeeId",
fields: {
EmployeeId: { editable: false, nullable: true },
Name: { validation: { required: true } },
Email: { validation: { required: true } },
IsManager: { type: "boolean" },
MaxHolidaysPerYear: { editable: false, type: "number", validation: { min: 0, required: true } },
HolidaysLeftThisYear: { type: "number", validation: { min: 0, required: true } }
}
}
},
error: function (e) {
if (e.xhr.responseText !== undefined) {
console.log(e.xhr.responseText);
}
}
});
dataSource.online(navigator.onLine);
$(window).on("offline", function () {
dataSource.online(false);
});
$(window).on("online", function () {
dataSource.online(true);
});
return dataSource;
});
})();
离线时,调用getItem,然后使用空数组调用setItem,因此:
if (item.length > 0) {
localforage.setItem("employees-key", JSON.stringify(item));
}
当promise最终返回离线数据,并返回我期望的正确值时,网格将不显示任何结果
这种行为大概是因为承诺
我用sessionStorage做了同样的尝试,效果非常好。。。i、 e:
getItem: function () {
return JSON.parse(sessionStorage.getItem("employees-key"));
},
setItem: function (item) {
sessionStorage.setItem("employees-key", JSON.stringify(item));
}
我能做些什么来解决这个问题呢?刚刚从Telerik那里得到消息 他们的GitHub repo中记录了一个关于相同问题的问题 您可以在此处跟踪进度: