Question

我的数据库表中有base64字符串图像。我想将数据库中的图像加载到我的多通道应用程序中。我如何绑定它们，直接从数据库中调用字符串？非常感谢。

现在我有了这段代码。

HTML

<div data-options="dxView : { name: 'tb_proj_gallery', title: 'tb_proj_gallery', targetFrame: 'navigation' } " >
    <div data-options="dxContent : { targetPlaceholder: 'content' } " >
    <div class="gallery" data-bind="dxGallery: { width: '100%', height: '100%', dataSource: dataSource, showNavButtons: true }">
        <div data-options="dxTemplate : { name: 'item' } " >
            <div class="gallery-item">
                <img data-bind="attr: { src: 'data:image/jpeg;base64,' + file_name }" />
            </div>
        </div>
    </div>
</div>

JS

KioskAppV2.tb_proj_gallery = function(params) {
"use strict";

var shouldReload = false,
    dataSource;

function handletb_proj_galleryModification() {
    shouldReload = true;
}

function handleViewShown() {
    if(shouldReload) {
        shouldReload = false;
        dataSource.load();
    }
}

dataSource = new DevExpress.data.DataSource({
    store: KioskAppV2.db.tb_proj_gallery,
    map: function(item) {
        return new KioskAppV2.tb_proj_galleryViewModel(item);
    }
});

return {
    dataSource: dataSource,
    viewShown: handleViewShown
};

};

file_name是tb_proj_gallery表中保存图像base64字符串的列名。此代码返回图库中具有相同图像数量的图库视图，但图像未显示。它坏了。如何让它出现？ TQ

Answer 1

使用attr绑定来绑定base64字符串图像。

<img  data-bind="attr:{src: image}"/>//image is observable containing base64 string

视图模型： -

var base64string = "//your base64 string";

var Vm = {
   image: ko.observable(base64string)
};
ko.applyBindings(Vm);

Fiddle Demo

如何将数据库中的base64图像绑定到多通道应用程序？

1 个答案: