Question

我在说UI。我有要在列表中显示的项目列表。但在此之前，我必须检查一个列值，并需要使用要显示的图标来操纵此值。如何在SpeakUI中实现此更改。请帮忙

Answer 1

简单选项：

如果您收到的数据与您要显示的图标直接相关：

将您的DataSource上的ListControl设置为ListControl Parameters项，其下方有ColumnField项（如Sitecore doco或other blogs中所述）。在列的HTMLTemplate字段中，您可以将该值用作具有背景图像样式的图像或CSS类的源。

<img src="{{YourField}}" />

或

<span class="{{YourField}}"></span>

你的span类为你的图标设置样式。

更复杂但可自定义：

我不确定您使用的数据源，但我是JsonDataSource by Anders Laub的粉丝，因为它非常易于使用和自定义（您只需要添加2个小文件）

在SPEAK效果图中添加JsonDataSource和ListControl项目属性：{Binding JsonDataSource.Json}（根据需要添加数据源）

然后在您的页面的javascript中（在PageCode呈现中定义），您可以向此数据源添加项目并根据需要进行自定义：

jQuery.ajax({
    type: "GET",
    dataType: "json",
    url: "/yourApiCall" + params,
    cache: false,
    success: function (data) {
        var total = 0;
        for (var i = 0; i < data.YourItems.length; i++) {
            app.JsonDataSource.add({
                Col1: data.YourItems[i][0],
                Col2: data.YourItems[i][1],
                Col3: data.YourItems[i][2]
            });
    }
},

其中Col1，Col2和Col3是列的名称，而YourItems是您从ajax调用中接收的项目数组。

Sitecore Speak UI：如何在列表中显示之前操纵List Control的列值。

1 个答案: