Question

我有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：binding将模板绑定到普通javascript对象的ObservableArray。除BackColor外，所有对象属性都正确绑定。 BackColor是一个属性，而不是一个函数，它的值总是一个正确的CSS颜色（例如，＃556677）;但是，它只是作为BackColor绑定在DOM中，而不是它的值。

这个模板和绑定在knockout.js 2.1中有效，但我正在将它迁移到knockout.js 3.0，它无法正常工作。

我尝试在javascript对象中添加一个函数，该函数返回CSS颜色，并绑定到ShowBackColor()，但这会在挖空中产生一个javascript错误。

有关将此背景样式颜色正确绑定的任何建议吗？

Answer 1

尝试在backgroundColor周围加上引号。

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

Answer 2

您可以使用attr绑定来作弊。这是一种解决方法，而不是解决方案（我有同样的问题）：

<sup><a href="#fn2" id="r2">2</a></sup>

knockoutjs风格没有约束力

2 个答案: