受保護的Observable重新渲染整個視圖模型

我在使用此鏈接下面的protectedObservable自定義綁定時遇到問題。受保護的Observable重新渲染整個視圖模型

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

的保護觀察到嵌套在3個模板。

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

當這不是一個受保護的observable時，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; 
    };

enter image description here

UPDATE

我發現，除去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 }; 
    } 
};

來源

2012-08-24 Mike Flynn

你可以把東西放在jsFiddle？也許是一個簡單的例子如有必要，有多種方法可以調整受保護的可觀察項。 –

此外，您將始終希望在選擇中的「選項」綁定之後放置「value」綁定。如果選項尚不存在，那麼值綁定將認爲您的選擇是無效的。 –

我會嘗試創建一個小提琴，但頁面包含很多邏輯和html，所以我不知道我可以複製它，除非我複製整個頁面。我試圖把價值放在約束的最後，但同樣的交易。 –

我刪除了stopBinding：true，它修復了它。所以我採用了不同的路線來填充動態HTML，因爲我仍然想使用stopBinding：true。我明確地填充了在ajax調用期間填充的動態HTML容器。因此，我沒有使用容器元素的「html」綁定來設置它，而是使用jQuery $（container）.html（...）來填充它。我的最終實施如下。 stopBinding根據ajax頁面的stopBinding屬性使用父虛擬機或新虛擬機。

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

來源

2012-08-27 17:31:15

受保護的Observable重新渲染整個視圖模型

回答

相關問題