剑道Ui MVVM:无法从数据绑定中检索值_Mvvm_Kendo Ui

剑道Ui MVVM:无法从数据绑定中检索值

mvvm kendo-ui

剑道Ui MVVM:无法从数据绑定中检索值,mvvm,kendo-ui,Mvvm,Kendo Ui,我从剑道MVVM开始。我能够检索数据并在listview中显示它们。但我正在努力解决两个问题第一：如何从数据绑定返回值？当单击行时，我尝试在url函数中显示数据绑定的值=“text:name”，但我不知道如何执行第二个问题：是否可以将字符串添加到数据绑定？或者如何做到这一点？我想在data bind=“text:image”之前添加“Images/” 这是我的代码： <div id="container" data-model="mobileListViewModel" data-ro

我从剑道MVVM开始。我能够检索数据并在listview中显示它们。但我正在努力解决两个问题

第一：如何从数据绑定返回值？当单击行时，我尝试在url函数中显示数据绑定的值=“text:name”，但我不知道如何执行

第二个问题：是否可以将字符串添加到数据绑定？或者如何做到这一点？我想在data bind=“text:image”之前添加“Images/”

这是我的代码：

<div id="container" data-model="mobileListViewModel" data-role="view" id="mobile-listview-events">        
    <ul data-role="listview" data-style="inset" data-type="group" data-template="ul-template" data-bind="source: theList"></ul>     
</div>   

<script id="ul-template" type="text/x-kendo-template"> 

    <a data-bind="click:url"><span data-bind="text:image"></span> <span data-bind="text:name"></span><span class="bubble" data-bind="text:type"></span></a>    

</script>          

    <script>      
   var crudServiceBaseUrl = "url";       
        var a = kendo.observable({
            theList: new kendo.data.DataSource({  
transport: {

                read: {
                           url: crudServiceBaseUrl + "/api/home/get",
                           dataType: "jsonp"
                       },
                schema: {

                    model: {
                        id: "ID_test",
                        fields: {
                            ID: {
                                editable: false,
                                nullable: false
                            },
                            name: {
                                editable: false,
                                nullable: false
                            },
                            map: {
                                editable: false,
                                nullable: false
                            },
                            type: {
                                editable: false,
                                nullable: false
                            },
                            image: 

                            {
                                editable: false,
                                nullable: false,

                            }, 
                            path: 
                            {  
                            },  

                        }    
                        }  
                    }    
                }  
            }), 
                url: function(e) {
                alert(model.name);
                },
        });  

        a.set("path", "Images/");
        kendo.bind($("#container"), a); 

    </script>



var crudServiceBaseUrl=“url”；
var a=可观察的剑道({
列表：new kendo.data.DataSource（{
运输：{
阅读：{
url:crudServiceBaseUrl+“/api/home/get”，
数据类型：“jsonp”
},
模式：{
型号：{
id:“id_测试”，
字段：{
身份证：{
可编辑：false，
可为空：false
},
姓名：{
可编辑：false，
可为空：false
},
地图：{
可编辑：false，
可为空：false
},
类型：{
可编辑：false，
可为空：false
},
图片：
{
可编辑：false，
可为空：false，
}, 
路径：
{  
},  
}    
}  
}    
}  
}), 
url:函数（e）{
警报（型号名称）；
},
});  
a、 设置（“路径”、“图像/”）；
剑道绑定（$（“#容器”），a）；

我为这些问题挣扎了好几个小时，所以我将感谢任何帮助。谢谢。

首先：我已修改了您的示例-单击的数据项可通过e.data

第二：可以通过将属性声明为可计算函数来实现（参见下面的示例）



var crudServiceBaseUrl=“url”；
var a=可观察的剑道({
列表：新建kendo.data.DataSource({
数据：[
{
ID:'A'，
名称：‘A’，
地图：“A”，
键入：“A”，
图片：“A”，
路径：“A”
},
{
ID:'B'，
名称：‘B’，
地图：‘B’，
类型：“B”，
图片：“B”，
路径：“B”
}
]
}),
url:函数（e）{
警报（如数据、名称）；
},
副处长：职能（）{
返回这个.path+'flower.jpg'；
}
});
a、 设置（“路径”、“图像/”）；
剑道绑定（$（“#容器”），a）；

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <script src="../js/libs/jquery.min.js"></script>
    <script src="../js/libs/kendo.all.min.js"></script>
</head>
<body>
<div id="container">
    <div data-model="mobileListViewModel" data-role="view" id="mobile-listview-events">
        <ul data-role="listview" data-style="inset" data-type="group" data-template="ul-template" data-bind="source: theList"></ul>
    </div>
    <div data-bind="text: dep"></div>
</div>

<script id="ul-template" type="text/x-kendo-template">
    <div data-bind="click:url">
        <span data-bind="text:image"></span>
        <span data-bind="text:name"></span>
        <span class="bubble" data-bind="text:type"></span>
    </div>
</script>

<script>
    var crudServiceBaseUrl = "url";
    var a = kendo.observable({
        theList: new kendo.data.DataSource({
            data: [
                {
                    ID: 'A',
                    name: 'A',
                    map: 'A',
                    type: 'A',
                    image: 'A',
                    path: 'A'
                },
                {
                    ID: 'B',
                    name: 'B',
                    map: 'B',
                    type: 'B',
                    image: 'B',
                    path: 'B'
                }
            ]
        }),
        url: function(e) {
            alert(e.data.name);
        },
        dep: function() {
            return this.path+'flower.jpg';
        }
    });
    a.set("path", "Images/");
    kendo.bind($("#container"), a);
</script>
</body>
</html>