listview - 如何在列表视图项模板中添加数据图标

Question

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

截至目前，我创建了我想要的列表视图链接，如下所示：

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

这给了我一个列表视图链接，左边是“特色”字体图标，后面是链接文本，右边是一个小箭头。

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

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

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

谢谢！

Answer 1

只需选择一个元素并向其添加.km-icon和.km-featuredcss 类。

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

您可以在kendo 的移动演示页面上检查图标，看看它是如何呈现的。