详细模板中列客户端模板中的kendo ui“无效模板”错误

Question

我有一个带有客户端详细模板的网格。此详细模板在单独的部分视图中呈现。在这个网格中，我需要使用客户端模板来格式化一些列。不幸的是，我遇到了一个无效的模板错误。

这是我的详细模板：

<script id="operationDetailTemplate" type="text/kendo-template">
@(Html.Kendo().TabStrip()
    .Name(componentName: "tabStrip_#=Id#")
    .SelectedIndex(index: 0)
    .Animation(animation => animation.Open(open => open.Fade(FadeDirection.In)))
    .Items(items => {
        items.Add().Text(this.LocalResources(key: "Messages")).Content(@<text>
            @(Html.Kendo().Grid<NotificationViewModel>()
                .Name(componentName: "notificationGrid_#=Id#")
                .Pageable()
                .Scrollable()
                .Filterable()
                .Sortable()
                .Columns(col => {
                    col.Bound(c => c.DateCreated).Format(value: "{0:yyyy/MM/dd HH:mm}");
                    col.Bound(c => c.Severity);
                    col.Bound(c => c.Title);
                    col.Bound(c => c.Text).ClientTemplate(string.Format("{0}...", "#= formatter(Text, 20) #"));
                })
                .DataSource(ds => ds.Ajax().Sort(sort => sort.Add(memberName: "DateCreated").Descending())
                    .Read(read => read.Route(MessageEventControllerRoute.PostReadForOperation, new RouteValueDictionary { { "operationId", "#=Id#" }, { "culture", UICulture.ToLower() } })))
                .ToClientTemplate())
        </text>
            );
        items.Add().Content(@<text>
            @(Html.Kendo().Grid<OperationViewModel>().Name(componentName:"alternativesGrid")
                .Columns(col => {
                    col.Bound(op => op.OperationIdFormatted);
                    col.Bound(op => op.EfficiencyRank);
                    col.Bound(op => op.WorkOrder.WorkOrderIdFormatted);
                    col.Bound(op => op.Length)
                        .ClientTemplate(value: "#if (data.Length) {# #:kendo.toString(Length.Hours, '00')#:#:kendo.toString(Length.Minutes, '00')#:#:kendo.toString(Length.Seconds, '00')# #}#")
                        .EditorTemplateName(templateName: "TimeSpan");
                })
                .DataSource(ds => ds.Ajax()
                .Read(read => read.Route(OperationControllerRoute.PostOperationAlternatives, new RouteValueDictionary { { "workOrderId", "#=Operation.WorkOrderId#" }, { "seqNo", "#=Operation.SequenceNumber#" }, { "culture", UICulture.ToLower() } })).Model(m => m.Id(op => op.Id)))
                .ToClientTemplate()
            )</text>);
    })
    .ToClientTemplate())
</script>

由于无法将模板id传递给列模板，因此不知道如何避免无效的模板错误。

在这个场景中如何使用客户端模板，有什么想法吗？

向贝恩德问好

Answer 1

经过更多的实验，我找到了两个解决方案。

1. 在低级别网格中转义客户端模板。

使用

            .ClientTemplate(value: "\\#if (data.Length) {\\# \\#:kendo.toString(Length.Hours, '00')\\#:\\#:kendo.toString(Length.Minutes, '00')\\#:\\#:kendo.toString(Length.Seconds, '00')\\# \\#}\\#")

而不是

            .ClientTemplate(value: "#if (data.Length) {# #:kendo.toString(Length.Hours, '00')#:#:kendo.toString(Length.Minutes, '00')#:#:kendo.toString(Length.Seconds, '00')# #}#")

1. 将选项卡内容更改为按需加载。

这里唯一的问题是ajax数据源没有被调用。因此，将模型传递到部分视图，并移除

    .ToClientTemplate()

说明。