1

データベース テーブルに 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 は、画像の base64 文字列が保存される tb_proj_gallery テーブルの列名です。このコードは、テーブル内の同じ数の画像を含むギャラリー ビューを返しますが、画像は表示されませんでした。壊れてます。出現させる方法は？TQ。

4

1 に答える 1

3

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);

フィドルのデモ

于 2014-03-21T09:42:56.543 に答える