объединить статический путь к изображению с привязкой данных knockoutJs - PullRequest
Новая
       34

объединить статический путь к изображению с привязкой данных knockoutJs

0 голосов
/ 15 октября 2019

Это мой JS-код: 

define([
    'uiComponent'
], function (Component) {
    'use strict';
    // var show_hide_custom_blockConfig = window.checkoutConfig.quoteData.entity_id;
    var up_selling_products = window.checkoutConfig.up_selling_product.up_selling_product;


    return Component.extend({
        defaults: {
            template: 'MyModule/checkout/shipping/additional-block'
        },
        upSellingProducts: up_selling_products ,

    });
});

как конкатенировать статический путь к изображению в knockoutJs, использую этот код 

<table>
    <thead>
    <tr><th>Name</th><th>Sku</th><th>ImagePath</th><th>Image</th></tr>
    </thead>
    <tbody data-bind="foreach: upSellingProducts">
    <tr>
        <td data-bind="text: name"></td>
        <td data-bind="text: sku"></td>
     <td data-bind="text: image"></td>
        <td> <img  data-bind="attr: { src: 'pub/media/catalog/product'+image, alt: not found }"></img></td>



    </tr>
    </tbody>
</table>

проверить выходной путь к изображению не нравитсяи он прерывает цикл

enter image description here

td data-bind = "text: image"> возвращает динамический путь моего продукта, но как объединить мой статический путь pub / media / каталог / product

в приведенном выше коде data-bind="attr: { src: 'pub/media/catalog/product'+image} не работает.

1 Ответ

1 голос
/ 16 октября 2019

есть несколько возможностей, вам, вероятно, следует поделиться js-viewmodel и содержимым свойства img, чтобы у нас была полная картина проблемы.

  • theТег img является самозакрывающимся элементом, поэтому вам нужно будет <img data-bind="" />

  • не знать, что находится в свойстве image, но обычно только имя файла, затемваш статический путь должен заканчиваться косой чертой и, возможно, даже начинаться с одного ~/pub/../product/

  • , как указано в комментариях, если свойство является наблюдаемым, вам нужно будет сделать ... + image()

...