Question

我似乎无法理解为什么，但我有2个“组件”我正在尝试模板和绑定，只有第二个按预期工作。

第一个显然是模板确定但不绑定（数据未按照模板行中声明的绑定填充）。

有谁知道为什么？

组件1：网格，包含1个模板项...

<div class="component k-content" data-type="BusinessTask">
    <h2><span class="k-sprite folder"></span>  Business Tasks <img src="/Content/close.png"></h2>
    <script>
        $(function () {
            //TODO: add signalR behaviour to allow grid update notifications from the server
            dependency.get('BusinessTask');
            BusinessTaskGridChange = function (arg) {
                if(typeof BusinessTask.gridItemClick != 'undefined') {
                    var grid = $("#BusinessTaskGrid").data("kendoGrid");
                    var item = grid.dataItem(grid.select());
                    BusinessTask.gridItemClick(item);
                }
            };

            var BusinessTaskModel = createModel('BusinessTask');

            $("#BusinessTaskGrid").kendoGrid({
                dataSource: BusinessTaskModel,
                rowTemplate: kendo.Template.compile($("#BusinessTaskRow").html()),
                selectable: "row",
                columns: type.columnsFor("BusinessTask"),
                change: BusinessTaskGridChange,
                error: page.error
            });
        });
    </script>
    <script id="BusinessTaskRow" type="text/x-kendo-template">
        <tr>
            <td><span data-bind="text: ID"></span></td>
            <td><a href="" data-ref-type="Workflow" data-bind="attr: { data-ref: WorkflowID }, events: { click: refClick }">View Workflow</a></td>
            <td><span data-bind="text: FlowPosition"></span></td>
            <td><span data-bind="text: Title"></span></td>
            <td><pre data-bind="text: Description"></pre></td>
            <td><span data-format="dd MMM yyyy" data-bind="text: Created"></span></td>
            <td><span data-format="dd MMM yyyy" data-bind="text: Due"></span></td>
            <td><span data-bind="text: BusinessTaskStatusID"></span></td>
            <td><span data-bind="text: BusinessTaskTemplateID"></span></td>
            <td><span data-bind="text: DependentEntityID"></span></td>
            <td><input type="checkbox" data-bind="checked: ActiveStatusID" readonly="readonly" disabled="disabled" /></td>
            <td><span data-bind="text: SystemID"></span></td>
        </tr>
    </script>
    <div id="BusinessTaskGrid" class="details k-grid k-widget" data-role="grid"></div>
</div>

组件2：直接绑定单个项目（没有剑道网格）...

<div id="BusinessTask1_View" class="component k-content" data-type="BusinessTask">
    <h2><span class="k-sprite edit"></span>  Business Task: 1 <img src="/Content/close.png"></h2>
    <script>
        $(function () {
            dependency.get('BusinessTask');            
            var BusinessTask1_ViewModel = createModel('BusinessTask', '1');
            var component = $("#BusinessTask1_View");
            kendo.bind(component, BusinessTask1_ViewModel);
        });
    </script>
    <div class="details">
        <ul class="fieldList">
            <li>
                <label for=""> Workflow</label>
                <div class="value"><a href="" data-ref-type="Workflow" data-bind="attr: { data-ref: WorkflowID }, events: { click: refClick }" data-ref="1">View Workflow</a></div>
            </li>
            <li>
                <label for=""> Flow Position</label>
                <div class="value"><span data-bind="text: FlowPosition"></span></div>
            </li>
            <li>
                <label for=""> Title</label>
                <div class="value"><span data-bind="text: Title"></span></div>
            </li>
            <li>
                <label for=""> Description</label>
                <div class="value"><pre data-bind="text: Description"></pre></div>
            </li>
            <li>
                <label for=""> Created</label>
                <div class="value"><span data-format="dd MMM yyyy" data-bind="text: Created"></span></div>
            </li>
            <li>
                <label for=""> Due</label>
                <div class="value"><span data-format="dd MMM yyyy" data-bind="text: Due"></span></div>
            </li>
            <li>
                <label for=""> Business Task Status</label>
                <div class="value"><span data-bind="text: BusinessTaskStatusID"></span></div>
            </li>
            <li>
                <label for=""> Business Task Template</label>
                <div class="value"><span data-bind="text: BusinessTaskTemplateID"></span></div>
            </li>
            <li>
                <label for=""> Dependent Entity</label>
                <div class="value"><span data-bind="text: DependentEntityID"></span></div>
            </li>
            <li>
                <label for=""> Active Status</label>
                <div class="value"><input type="checkbox" data-bind="checked: ActiveStatusID" readonly="readonly" disabled="disabled"></div>
            </li>
            <li>
                <label for=""> System</label>
                <div class="value"><span data-bind="text: SystemID"></span></div>
            </li>
        </ul>
        <hr>
        <button class="k-button" data-bind="events: { click: edit }">Edit</button>
    </div>
</div>

Answer 1

看起来kendo本身有点不一致。

例如

如果我使用“$（”selector“）。kendoSomething（{options}）;”创建一个kendo控件，它看似模板但不绑定。我的意思是，在给定模板绑定但实际上不执行绑定声明的情况下，网格将为模板生成一行，其中包含data-bind =“stuff”。

但是执行kendo.bind（$（“selector”），model）将执行绑定和模板化操作，以及使用data-role属性声明的init kendo控件。

这里有一些特殊的行为，我要求Telerik将其标准化以保持一致性。

剑道绑定和模板

1 个答案: