受保护的Observable重新呈现整个视图模型

Question

我在使用此链接下面的protectedObservable自定义绑定时遇到问题。

http://www.knockmeout.net/2011/03/guard-your-model-accept-or-cancel-edits.html

受保护的observable嵌套在3个子模板中。

<select class="select-teams bracket-select" data-bind="value: divisionTeamId, options: $root.teams, optionsText: 'Name', optionsValue: 'Id', optionsCaption: ' - Teams - '"></select>

当这不是受保护的可观察对象时，viewmodel不会重新呈现自己。当它受到保护时，模板会重新渲染并失去它的初始值。任何线索为什么会这样？

self.divisionTeamId = ko.protectedObservable(undefined);

自定义绑定

ko.protectedObservable = function (initialValue) {

        var _actualValue = ko.observable(initialValue),
        _tempValue = initialValue;

        var result = ko.computed({
            read: function () {
                return _actualValue();
            },
            write: function (newValue) {
                _tempValue = newValue;
            }
        });

        result.commit = function () {
            if (_tempValue !== _actualValue()) {
                _actualValue(_tempValue);
            }
        };

        result.reset = function () {
            _actualValue.valueHasMutated();
            _tempValue = _actualValue();
        };

        return result;
    };

更新

我发现删除stopBinding解决了这个问题。

<div data-bind="stopBinding: true">
    <div id="bracket-namespace">
          .....
    </div>
</div>

    app.members.bracket.init = function (options) {
        viewModel = new ViewModel(options);

        ko.applyBindings(viewModel, document.getElementById("bracket-namespace"));
    };

ko.bindingHandlers.stopBinding = {
    init: function () {
        return { controlsDescendantBindings: true };
    }
};

Answer 1

我删除了stopBinding：true并修复了它。所以我采用了不同的路径来填充动态HTML，因为我仍然想使用stopBinding：true。我明确填充了在ajax调用期间填充的动态HTML容器。因此，我使用jQuery $（容器）.html（...）来填充它，而不是使用容器元素的“html”绑定来设置它。我的最终实施如下。 stopBinding使用父VM或新VM，具体取决于ajax页面stopBinding属性。

<div id="container" class="clearfix" data-bind="stopBinding: members.stopBinding, container: {}">  
     @RenderBody()
</div>