Привязка массива объектов к списку кендо
У меня есть случай, когда моя ViewModel имеет массив, например,
{id: 0,
Name: "KendoListView1",
dataitems: [{id: 1, itemName: "Kendo"}, {id: 2, itemName: "List"}]
},
{id: 2,
Name: "KendoListView2",
dataitems: [{id: 3, itemName: "Kendo"}, {id: 4, itemName: "List"}]
},
{id: 3,
Name: "KendoListView3",
dataitems: []
}
Так что теперь, когда я связываю свою ViewModel с шаблоном ListView, мой шаблон должен обрабатывать случай, когда, если существует массив, я показываю элементы массива в представлении, а когда массив пуст, мне просто нужно показать имя (KendoListView1, KendoListView2), а не элементы Array
Мне нужна структура шаблона, как это:
<script id="template" type="text/kendo-ui-template">
# if(dataitems.length) { #
<div>
//Show all the items Names from the Array
</div>
# } else {#
<div>
//Show all the Names
</div>
# } #
</script>
Я пытался перебирать массив, используя цикл for, и отображать элементы, когда у меня есть массив, но во время выполнения, когда я добавляю новый элемент в массив, цикл for снова будет проходить через все элементы и отображать все элементы.
Может ли кто-нибудь помочь мне в этом случае
1 ответ
.Map().Join()
может быть использован для рендеринга вашего иногда заполнены dataitems
,
шаблон
<script id="my_funky_listview_template" type="text/x-kendo-template">
<div>
# if (dataitems.length) { #
#:
itemName + " items: " + dataitems.map(function(item){return item.itemName;}).join(",")
#
# } else { #
#:
Name
#
# } #
</div>
</script>
Декларация / конфигурация
<script>
$(function() {
$("#listview").kendoListView({
dataSource: dataSource,
template: kendo.template($("#my_funky_listview_template").html())
});
});
</script>
Если источник данных доставляет какой-либо контент, в котором отсутствует Name
или же dataitems
свойство консоли Javascript будет регистрировать '<property>' is not defined.
сообщение и список не появится.