Kendo UI MVVM数据源绑定到html输入元素

时间:2016-09-06 19:44:39

标签: mvvm kendo-ui kendo-datasource

新手到剑道

kendo数据源只返回数组,我的RESTful api将客户端作为一个元素的数组返回。

然而,我似乎无法约束“姓名”。客户端到html输入框的字段。

如果我把数据放在' ul中,我可以使用数据,如下面的代码所示。我知道json响应很好,因为我可以console.log(obj [0] .Name);

我试图在数据源的数据中返回obj [0],但这只是破坏了一切。 (没有切片错误消息,因为它试图切割数组)。

我确信这很容易,但我一定只想到这一切都错了......

下面是Html和js:

<div data-role="view" data-title="Client Detail" data-model="app.clientView">

<!-- this does not work -->

<input data-bind="value: app.clientView.data"/>
<input data-bind="value: app.clientView.data[0].Name"/>
<input data-bind="value: app.clientView.data.Name"/>

<!-- this works -->

<ul data-role="listview" data-source="app.clientView.data" data-template="client-template"></ul> 

<script type="text/x-kendo-template" id="client-template">
    <a href="components/clientView/view.html?id=#: ID #">
        <div>#: Name #</div>
        <div>#: LastActivityOn #</div>
    </a>
</script>

&#13;
&#13;
app.clientView = kendo.observable({
    data: new kendo.data.DataSource({
        transport: {
            read: {
                url: app.uri + "clients/69", //+ id,
                type: "get",
                dataType: "json",
                beforeSend: function (req) {
                    req.setRequestHeader('X-authKey', app.key);
                }
            }
		},
        schema: {
        	data: function (response) {
            	console.log(response);
            	var obj = $.parseJSON(response);
                console.log(obj[0].Name);
            	return obj;
        	}
        }
    })
});
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:3)

Kendo UI MVVM value绑定无法指向Kendo UI DataSource实例。只有source绑定才能做到这一点。

在您的情况下,重做您的实现并向viewModel(app.clientView)添加一些新字段,这些字段可用于值绑定。可以populate这些字段after the DataSource instance receives its data

另外,没有必要通过在绑定配置中包含viewModel引用来详细指定viewModel字段。你只需要那里的字段名称。检查Kendo UI MVVM demos