如何在listview项模板中添加数据图标

Question

我正在使用JQuery初始化语法。

截至目前，我创建了我想要的listview链接：

<li data-icon="featured"><a>My Listview Item Link</a></li>

这给了我一个listview链接，左边是“精选”字体图标，后面是链接文字，右边是一个小箭头。

我要做的是转换为使用模板，但是我无法实现与上述相同的结果。这是我到目前为止所做的：

<script type="text/x-kendo-template" id="mListviewTemplate">
    <a data-role="listview-link">${name}</a>
</script>

这导致了我需要的东西，除了缺少的字体图标。文档说明我可以添加一个<img>元素来获取字体图标，但它有点模糊且没有示例。

谢谢！

Answer 1

只需选择一个元素，然后将.km-icon和.km-featured css类添加到其中。

<script type="text/x-kendo-template" id="mListviewTemplate">
    <span class="km-icon km-featured"></span><a data-role="listview-link">${name}</a>
</script>

您可以检查kendo's mobile demo page处的图标，看看这正是它的呈现方式。