Kendo Template, address certain element of json array - json

Question

Hi I'm trying to programm my first app in Icentium. I want to store wisdoms in a json array. Depending on your level you get a new wisdom. Unfortunately I don't know why it is shwoing the whole json array.
This is the lessons.js
(function(global) {
var LessonsViewModel,
app = global.app = global.app || {};
LessonsViewModel = kendo.data.ObservableObject.extend({
lessonsDataSource: null,
init: function () {
var that = this,
dataSource;
kendo.data.ObservableObject.fn.init.apply(that, []);
dataSource = new kendo.data.DataSource({
transport: {
read: {
url: "data/lessons/lessons.json",
dataType: "json"
}
}
});
that.set("lessonsDataSource", dataSource);
}
});
app.lessonsService = {
viewModel: new LessonsViewModel()
};
This is the view
<!--Lessons-->
<div id="tabstrip-lesson"
data-role="view"
data-title="Lektion"
data-model="app.lessonsService.viewModel">
<div class="lesson">
<div class="separator">
<div class="dark"></div>
<div class="light"></div>
</div>
<ul class="forecast-list"
data-role="listview"
data-bind="source: lessonsDataSource"
data-template="lessons-template"><!-- Das unten stehende Kendo Template wird hier eingefügt-->
</ul>
</div>
</div>
<!--Lessons Kendo Template für oben-->
<script type="text/x-kendo-tmpl" id="lessons-template">
<div>
<h1>${dojoroom}</h1>
<p>${text}</p><!-- Text aus Json File wird ausgelesen-->
</div>
</script>
This is my json array:
[
{
"dojoroom": "Dojo - First Room",
"text": "Bla bla bla!"
},
{
"dojoroom": "Dojo - Second Raum",
"text": "More Bla"
}
]

Answer 1

So far what I tried according to the Kendo Documenation (http://docs.kendoui.com/api/framework/datasource):
LessonsViewModel = kendo.data.ObservableObject.extend({
lessonsDataSource: null,
init: function () {
var that = this,
dataSource;
kendo.data.ObservableObject.fn.init.apply(that, []);
dataSource = new kendo.data.DataSource({
transport: {
read: {
url: "data/lessons/lessons.json",
dataType: "json"
}
}
});
that.set("lessonsDataSource", dataSource.at(0));
}
});
But this doesn't show anything at all. I also tried dataSource[0] and the same approaches in the view.
And dataSource.fetch(function(){
var dojo = dataSource.at(0);
that.set("lessonsDataSource", dojo);
});