1

ノックアウト 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)。ただし、値ではなく、単に BackColor として DOM にバインドされます。

このテンプレートとバインドは、knockout.js 2.1 で機能していましたが、knockout.js 3.0 に移行していますが、機能しません。

CSSの色を返すJavaScriptオブジェクトに関数を追加してバインドしようとしましたShowBackColor()が、これによりノックアウトの深いところでJavaScriptエラーが発生します。

この背景スタイルの色を正しくバインドするための提案はありますか?

4

2 に答える 2

0

backgroundColor を引用符で囲んでみてください。

data-bind="style: { 'backgroundColor': BackColor, 'backgroundImage': 'none' }"
于 2014-04-10T19:46:04.753 に答える
0

attr バインディングを使用してごまかすことができます。これは回避策であり、解決策ではありません (私は同じ問題を抱えています):

data-bind="attr: { style: 'background-color: ' + BackColor() + '; background-image: none' }"
于 2020-05-22T14:03:52.990 に答える