javascript - 如何在knockoutjs绑定(bind)中添加动态添加背景图像？

Question

我正在使用knockout.js绑定(bind) li 元素

如下:

<ul class="grid" data-bind="foreach: articledashboard">
    <li data-bind="style: { background-image: url(AuthorImage)}">
        <label data-bind="attr: { title: Title }, text: Title"></label>
    </li>
</ul>

我的要求是设置li元素的背景图像，但我的代码不起作用

你能给我正确的语法吗？

Answer 1

使用backgroundImage代替background-image，并将值设置为字符串:

<li data-bind="style: { backgroundImage: 'url(' + AuthorImage() + ')'}">

参见documentation

编辑:

如RP Niemeyer指出，您还可以使用'background-image':

<li data-bind="style: { 'background-image': 'url(' + AuthorImage() + ')'}">

请注意，这假设 AuthorImage 是一个可观察对象。如果不是，请使用 AuthorImage。