knockout.js - 动态添加属性到可观察对象

Question

我有一个像这样的 View 模型，

        function viewModel() {
            this.loadData = function() {
                this.Items().C = 3;
            };

            this.Items = ko.observable({ A: 1});
            this.Items().B = 2;
        }

        var vm = new viewModel();
        ko.applyBindings(vm);
        vm.loadData();

我正在打印这样的值，

        <span data-bind="text: $root.Items().A"></span>
        <span data-bind="text: $root.Items().B"></span>
        <span data-bind="text: $root.Items().C"></span>

它打印出 A 和 B 的值，但不打印出 C 的值？

谢谢。

Answer 1

由于 C 本身最初是不可观察的，因此绑定(bind)不会知道在发生更改时需要更新。

要使其更新，您需要完全重置Items:

this.loadData = function() {
    var existing = this.Items();
    existing.C = 3;
    this.Items(existing);
};

或者调用 observable 的 valueHasMutated 函数，强制任何订阅者进行更新，如下所示:

this.loadData = function() {
    this.Items().C = 3;
    this.Items.valueHasMutated();
};