从Kendo上的listview项模板访问模型数据

时间:2014-02-08 01:59:31

标签: javascript kendo-ui

我需要从listview项目的模板中访问模型字段。基本上我需要用viewModel中的“valueToAccess”替换第一个名字。有些人可以帮助我。

<div id="app"></div>

<script type="text/x-kendo-template" id="item-template">
    <a href="/#= name #/#= name #">#= name #</a>
</script>

<script type="text/x-kendo-template" id="view-template">
    <div data-role="listview"
         data-bind="source: items"
         data-template="item-template">
    </div>
</script>

<script>

    var viewModel = {
        items: new kendo.data.DataSource({
            data: [{ name: "item1" }, { name: "item2" }]
        }),

        valueToAccess: "index",

        remove: function(e){
            this.items.remove(e.data);
        }
    };

    viewModel.items = new kendo.data.DataSource({
        data: [{ name: "item1" }, { name: "item2" }]
    });

    var view = new kendo.View('view-template', { model: viewModel });

    view.render("#app");

</script>

<div id="app"></div>

1 个答案:

答案 0 :(得分:2)

您可以使用依赖属性来执行此操作。

<script type="text/x-kendo-template" id="item-template">
    <a data-bind="attr: { href: href}, text: name"></a>
</script>

<script>
var viewModel = {
    items: new kendo.data.DataSource({
        data: [{ name: "item1" }, { name: "item2" }]
    }),

    valueToAccess: "index",
    href: function(item) {
      return this.get("valueToAccess") + "/" + item.name;
    },

    remove: function(e){
        this.items.remove(e.data);
    }
};
</script>

这是一个现场演示:http://jsbin.com/naxiy/1/edit