knockout.js knockoutjs样式未绑定

yv5phkfx  于 2022-11-10  发布在  其他
关注(0)|答案(2)|浏览(250)

我有下面的knockout.js模板:

<script type="text/html" id="feed-template">
            <li data-bind="style: { backgroundColor: BackColor, backgroundImage: 'none' }"   >
                <a style="text-shadow: none" href="#" data-bind="click: ItemClicked">
                    <h1 style="WHITE-SPACE: normal; FONT-WEIGHT: bold" data-bind="text: PatientName"></h1>
                    <p style='white-space: normal;' data-bind="text: Description"></p>
                    <p style='white-space: normal;' data-bind="text: FeedEvent"></p>
                    <p style='white-space: normal;' data-bind="text: FeedTimeString"></p>
                    <span class="ui-li-count" data-bind="text: DisplayCount"></span>
                </a>
                <!-- ko if: ShowDelete -->
                    <a style="background: none; text-shadow: none;" href="#ConfirmUnfollowPopup" data-transition="pop" data-rel="popup" data-position-to="window" data-icon="delete" data-role="button"  data-inline="true" data-theme="b" data-bind="click: UnfollowClicked"></a>
                <!-- /ko -->
            </li>
        </script>

该模板将使用foreach绑定到普通javascript对象的ObservableArray:绑定。除了BackColor之外,所有对象属性都正确绑定。BackColor是一个属性,而不是函数,它的值总是正确的CSS颜色(例如,#556677);但是,它在DOM中只是作为BackColor绑定,而不是作为其值绑定。
这个模板和绑定在knockout.js 2.1中是有效的,但是我把它移植到了knockout.js 3.0中,在那里它不起作用。
我试过在javascript对象中添加一个函数,返回CSS颜色,并绑定到ShowBackColor(),但这会在knockout中产生一个javascript错误。
如何正确绑定此背景样式颜色?

blpfk2vs

blpfk2vs1#

请尝试在backgroundColor前后加上引号。

data-bind="style: { 'backgroundColor': BackColor, 'backgroundImage': 'none' }"
fivyi3re

fivyi3re2#

你可以使用attr binding来作弊。这是一个变通方法,而不是解决方案(我也有同样的问题):

data-bind="attr: { style: 'background-color: ' + BackColor() + '; background-image: none' }"

相关问题