Kendo MVVM scheduler template for agenda - mvvm

Question

I have this code...
$(function() {
var scheduler = $("#scheduler").kendoScheduler({
date: new Date("2015/1/1"),
views: [
{
type: "agenda",
eventTemplate: $("#event-template").html()
},
],
dataSource: [
{
id: 1,
start: new Date("2015/1/1 08:00 AM"),
end: new Date("2015/1/1 09:00 AM"),
title: "Test",
atendees: [1]
}
],
resources: [
{
field: "atendees",
dataSource: [
{ value: 1, text: "Jim" },
],
multiple: true
}
]
}).data("kendoScheduler");
$("#scheduler").on("click", ".edit-event",function() {
var dataItem = scheduler.occurrenceByUid($(this).data("uid"));
scheduler.editEvent(dataItem);
});
});
which works fine, but I am moving over to an MVVM approach can anyone help me get my new MVVM code to accept a template for my agenda view please. Code I have is
<script id="event-template" type="text/x-kendo-template">
<div class="edit-event" data-uid="#=uid#">
<div><b>Job</b>: #: title #</div>
<div>
<b>Staff:</b>
# for (var i = 0; i < resources.length; i++) { #
#: resources[i].text #
# } #
</div>
</div>
</script>
<div id="topper">
<div class="demo-section k-header wide">
<div>
<div data-role="scheduler" data-views="['agenda','month']" data-bind="source: tasks, visible: isVisible, events: { save: onSave }" data-template="event-template"></div>
</div>
</div>
</div>
Which does not work - doesn't crash, it just doesn't load the template I am also aware that this approach may use the template for all views not just agenda. Any help would be most appreciated.

Answer 1

To achieve the same behavior in MVVM you should define the view as object inside the "data-views" option:
<div data-role="scheduler"
data-views="['agenda',{ type: 'agenda', eventTemplate: $('\#event-template').html() }]"
data-bind="source: tasks, visible: isVisible, events: { save: onSave }"
data-template="event-template"></div>