如何为kendoUI中的不同列表视图项设置不同的颜色

Question

我在Listview中显示项目如下：

如何根据状态显示列表视图项的不同颜色？例如

以下是我所说的kendo ui代码示例。

＆＃13;

＆＃13;

<script type="text/x-kendo-tmpl" id="template">
  <div class="product">
    <h3>#:CustomerVersion#</h3>
    <h5>#:Rank#</h5>
    <h3>#:AccountType#</h3>
  </div>
</script>


<div class="demo-section">
  @Code Dim listName = "List" Dim listViewRankBar = Html.Kendo().ListView(Of RankBarModel)() With listViewRankBar .Name(listName) .TagName("div") .ClientTemplateId("template") .DataSource(Sub(datasource) datasource.Read(Sub(read) read.Action("Products_Read",
  "RankBar")) datasource.PageSize(15) End Sub) .Selectable(Sub(selectable) selectable.Enabled(True) selectable.Mode(ListViewSelectionMode.Single) End Sub) .Events(Sub(events) events.Change("onChange").DataBound("onDataBound") End Sub) '.Pageable() End
  With End Code @listViewRankBar
</div>

＆＃13;

＆＃13;

＆＃13;

Answer 1

假设您的状态字段为Status，则与此类似：

<script type="text/x-kendo-tmpl" id="template">
  <div class="product #if (Status == 'Active') {# active #} else {# inactive #}#">
    <h3>#:CustomerVersion#</h3>
    <h5>#:Rank#</h5>
    <h3>#:AccountType#</h3>
  </div>
</script>

可以在此处找到正在运行的示例：http://dojo.telerik.com/@mmillican/iDOSu