Я создал новый проект VS2012 с использованием шаблона hottowel, который в свою очередь использует дурандаль, нокаут и бриз.Использование durandal с jaydata и kendoui
Я хочу использовать jaydata вместо бриза и для слоя ui. Я хочу использовать превосходную функцию asKendoDataSource() для питания сетки kendoui.
Я выполнил все инструкции, чтобы сделать kendoui хорошо работать с durandal. Это отлично.
У меня есть модель, в которой я получаю объекты jaydata и запускаю ее какKendoDataSource(). Мое представление представляет собой MVVM, объявленную сетью kendoui, с ее исходным свойством, установленным в свойство viewmodel, которое содержит ссылку на asKendoDataSource().
В мире нокаутов свойство viewModel будет пустым сущностями = ko.observableArray(), которое затем будет инициализировано с использованием сущностей (значений), когда служба данных вернется.
Мне нужно подражать этому, так что у меня есть свойство viewModel, которое является пустым источником данных kendo, который затем инициализируется преобразованием asKendoDataSource(), когда данные возвращаются из jaydata. Таким образом, сетка mvvm kendo сначала связана с пустым источником данных, а затем получает свои элементы при вызове asKendoDataSource().
Это все потому, что привязка модели - viewModel в durandal является асинхронной, и с самого начала должно быть свойство placeholder в viewModel, которое затем, после того, как обещание метода viewModel активируется(), обновляется с помощью связанные данные и возвращать полномочия DOM, к которым привязан механизм viewModel.
Я не могу понять, как имитировать практику нокаута пустого наблюдаемого массива, привязанную к dom, а затем (ту же самую точную ссылку) инициализируется и заполняет dom. Кажется, что нет никакого способа создать пустой источник данных кендо, который затем повторно инициализируется методом asKendoDataSource(). Перенос свойства viewModel в новый источник данных не работает, потому что сетка кендо привязана к исходной ссылке.
Это мой вид аэропорта:
<section>
<h2 class="page-title" data-bind="text: title"></h2>
<div id="airportGrid" data-kendo-role="grid" data-kendo-sortable="true" data-kendo-pageable="true" data-kendo-page-size="25" data-kendo-editable="true" data-kendo-columns='["Id", "Abbrev", "Name"]' data-kendo-bind="source: airports"></div>
</section>
Это мой DataContext:
define([
'durandal/system',
'services/logger'],
function (system, logger) {
var getAirports = function (airportsObservable) {
$data.Entity.extend("Airport", {
Id: { type: "int", key: true, computed: true },
Abbrev: { type: String, required: true, maxLength: 200 },
Name: { type: String, required: true, maxLength: 512 }
});
$data.EntityContext.extend("JumpSeatDatabase", {
Airports: { type: $data.EntitySet, elementType: Airport }
});
var airportDB = new AirportDatabase('http://localhost:2663/odata');
var deferred = Q.defer();
airportDB.onReady(function() {
deferred.resolve(airportDB.Airports);
});
return deferred.promise;
}
var datacontext = {
getAirports: getAirports
};
return datacontext;
function log(msg, data, showToast) {
logger.log(msg, data, system.getModuleId(datacontext), showToast);
}
function logError(msg, error) {
logger.logError(msg, error, system.getModuleId(datacontext), true);
}
//#endregion
});
Это мой аэропорт ViewModel:
define(['services/datacontext', 'durandal/plugins/router'],
function (datacontext, router) {
var airports = null;// = kendo.data.ObservableArray([]);
var activate = function() {
var airportRes = datacontext.getAirports();
return airportRes.then(function (airp) {
vm.airports = airp.asKendoDataSource();
});
};
var deactivate = function() {
//airports([]);
};
var viewAttached = function (view) {
//using this type of reach in to the viewModel is considered bad practice in durandal
//$('#airportGrid').kendoGrid({
// dataSource: airports.asKendoDataSource({ pageSize: 10 }),
// filterable: true,
// sortable: true,
// pageable: true,
// height: 500,
// columns: ['Id', 'Abbrev', 'Name']
//});
//kendo.init($("#container"));
kendo.bind(view, vm);//this should eventually go away the recommended ViewModelBinder code in main.js is not firing for me
};
var vm = {
activate: activate,
deactivate: deactivate,
airports: airports,
title: 'Airports',
viewAttached: viewAttached
};
return vm;
});
Один последний вопрос, который я вижу: Мне кажется, что MVVM объявила сетку kendoui, привязанную к модели представления через data-kendo- bind = {source: airport) ", где аэропорты являются свойством viewmodel, который был создан через entity.asKendoDataSource() не работает. Так или иначе, сетка не отображает данные. Есть ли что-то дополнительное, что нужно сделать?
Благодаря