Knockout observable 未观察到其中一项属性答案

【问题标题】：One of the property is not being observed by Knockout observableKnockout observable 未观察到其中一项属性
【发布时间】：2012-09-08 00:59:30
【问题描述】：

所以我确实有一个淘汰模板，如下所示：

<tbody data-bind='foreach: PrizeFulfilmentStatuses'>
            <tr >
                <td><input data-bind='value: Description' /></td> 
                <td><input data-bind='value: Order' /></td>
                <td><input type="checkbox" data-bind="checked: Editable"/></td> 
                <td> <div data-bind = "attr:{color:ColorHex },style:{backgroundcolor: ColorHex}, value: ColorHex"  class="colorpickerHolder"  style="height:30px; border: transparent; width: 30px;"></div> </td>
            </tr>
        </tbody>

现在，您可以看到最后一个 TD 中的很多属性都被分配了 ColorHex。现在，这是我试图弄清楚的结果。

显然，像 Editable 和 description 之类的所有其他 observable 都是两种方式的绑定，因此如果我更改 UI 上的任何值，那么 observable 也会更改，并且当我将数据 POST 回服务器时，更改会反映回来。 ColorHex 不是。发布到服务器的值是最初来自服务器的原始值。此处未反映任何更改。

以下是更改绑定到 ColorHex 的属性的代码。它是一个颜色选择器 Jquery 插件：

self.ApplyColorPicker = function () {
            var $target = $(this);
            $(this).css("background-color", $(this).attr('color'));
            $(this).ColorPicker({
                color: $(this).attr('color'),
                onShow: function (colpkr) {
                    $(colpkr).fadeIn(500);
                    return false;
                },
                onHide: function (colpkr) {
                    $(colpkr).fadeOut(500);
                    return false;
                },
                onChange: function (hsb, hex, rgb) {
                    $target.css('backgroundColor', '#' + hex);
                    $target.attr('value', '#' + hex);
                }
            });
        };

你可以看到这两行：

$target.css('backgroundColor', '#' + hex);
                        $target.attr('value', '#' + hex);

当它们被执行时，我可以在萤火虫中看到“背景颜色”和值的值都在改变。但是在发布值或发布旧值而不是更新值时。

有什么建议吗？

【问题讨论】：

标签： javascript jquery data-binding knockout.js

【解决方案1】：

Knockout 不知道您何时通过 javascript 编辑值。您必须使用 ko.dataFor($target[0]).ColorHex('#' + hex) 手动更新 KO 变量：http://jsfiddle.net/UkJ6R/

我还修复了您的样式绑定，改为使用 backgroundColor，并删除了 onChange 方法中的其他两行，因为 KO 将为您更新这些属性。

【讨论】：