kendo移动数据绑定base64图像到图像标签

我有一个viewModel包含一个数据对象与3个值（名称，年龄，照片）。要访问数据属性，我可以执行data.name，data.age和data.photo。kendo移动数据绑定base64图像到图像标签

我无法在img标签中显示照片，但我可以将其内容放入输入字段。有任何想法吗？

在我看来，我有

<div 
    data-role="view" 
    data-layout="layout-customers" 
    id="customer" 
    data-title="Customer" 
    data-transition="slide:left" 
    data-model="app.customer.viewModel" 
    data-init="app.customer.init" 
    data-show="app.customer.show"> 

    <form> 
     <img data-bind="value: data.photo" src="data:image/png;base64"/> 
     <input type="text" data-bind="value: data.photo"/> 
     <input type="text" data-bind="value: data.name"/> 
     <input type="text" data-bind="value: data.age"/> 
    </form> 

</div>

来源

2013-10-22 user1753622

发现这样做实现这一目标的一种方式......

我添加的代码，它是由视图数据显示调用的函数以下行。 ..

//Get result here into result array 
viewModel.set("data", result[0]); 
var smallImage = $("#smallImage"); 
smallImage.attr("src", "data:image/jpeg;base64," + viewModel.data.photo);

查看

<img id="smallImage" src="" style="height:135px;"/>

有没有人有更好的方法？

来源

2013-10-22 09:34:59 user1753622

您可以添加一个计算字段到您的虚拟机，以创建图像期望的字符串。

可以说你的虚拟机看起来就像这样：

var VM = kendo.observable({ 
    name: undefined, 
    age: undefined, 
    photo: undefined 
});

所以你可以做：

var VM = kendo.observable({ 
    name: undefined, 
    age: undefined, 
    photo: undefined, 
    photoAsBase64: function() 
    { 
     return "data:image/jpeg;base64," + this.get('photo'); 
    } 
});

那么，你attr

<img data-bind="attr: { src: data.photoAsBase64 }" />

图像源 photoAsBase64绑定

来源

2015-08-26 08:59:53 avrahamcool

kendo移动数据绑定base64图像到图像标签

回答

相关问题