KendoUI:无法将数据绑定到JSON文件中的HTML元素。

Question

我不熟悉剑道ui和mvvm，我面临这个问题：

我有一个JSON文件，格式如下：

[
{
"Id":1,
"img":"shoes.png"},
{"Id":2,
"img":"books.png"}
    }
]

我正在使用剑道男孩在线提到的示例阅读该文件，如下所示：

var crudServiceBaseUrl = "pro.json";
    var viewModel = kendo.observable({
            productsSource: new kendo.data.DataSource({
                transport: {
                    read: {
                        url: crudServiceBaseUrl,
                        dataType: "json"
                    },
                    update: {
                        url: crudServiceBaseUrl,
                        dataType: "json"
                    },
                    destroy: {
                        url: crudServiceBaseUrl,
                        dataType: "json"
                    },
                    parameterMap: function(options, operation) {
                        if (operation !== "read" && options.models) {
                            return {
                                models: kendo.stringify(options.models)
                            };
                        }
                        return options;
                    }
                },
                batch: true,
                schema: {
                    model: {
                        id: "Id"
                    }
                }
            })
        });

        kendo.bind($("#form-container"), viewModel);

我能够将数据源中的数据绑定到剑道控件，如Dropdown列表或其他剑道控件。但是当我尝试将数据绑定到超文本标记语言控件（主要是img标记）时。它停止工作，并给出一个错误，说“this.parent”不是一个函数。

以下是有效的HTML：

Select Product: <select data-role="dropdownlist" data-value-field="Id" data-text-field="img"
                         data-bind="source: productsSource"></select>

然而绑定到一个正常的

请帮帮我。谢谢

-哈迪克




Answer 1

目前Kendo MVVM无法将数据源绑定到HTML元素。只有剑道UI小部件可以绑定到剑道。数据数据源。使用小部件（例如ListView）可用于DIV：

<div data-role="listview" 
     data-template="template"
     data-bind="source: productsSource">
</div>

<script id="template" type="text/x-kendo-template">
   <img data-bind="attr: { src: img }" />
</script>