Knockout observable訂閱

我們正在開發一個使用HTML前端（主要是視圖）和python後端（主要是文檔）的桌面應用程序。Knockout observable訂閱

該文檔通過使用輸入元素進行更新。該視圖更新調用updateView函數（打開文檔，撤消/重做，小工具...）。

所以，我們需要在用戶鍵入內容時通知文檔。通過訂閱observables並調用updateDocument來檢測更改。

主要問題是如果視圖由後端直接更新，我們不需要通知文檔。

如何在不通知文檔的情況下使用updateView更新視圖？

查看HTML：

<!DOCTYPE html> 
<html lang="fr"> 
    <head> 
     <meta http-equiv="Content-type" content="text/html;charset=UTF-8" /> 

     <script type="text/javascript" src="jsext/jquery-2.0.3.min.js"></script> 
     <script type="text/javascript" src="jsext/knockout-2.3.0.js"></script> 
     <script type="text/javascript" src="jsext/knockout.mapping.js"></script> 

     <script type="text/javascript" src="js/document.js"></script> 
     <script type="text/javascript" src="js/view.js"></script> 

    </head> 

    <body> 
     <div id="datas">    
      <div> 
       <p> 
        <label>x : </label> 
        <input type="text" data-bind="value: x"/> 
       </p> 
       <p> 
        <label>y : </label> 
        <input type="text" data-bind="value: y"/> 
       </p> 
       <p> 
        <label>z : </label> 
        <input type="text" data-bind="value: z"/> 
       </p> 
       <p> 
        <label>rx : </label> 
        <input type="text" data-bind="value: rx"/> 
       </p> 
       <p> 
        <label>ry : </label> 
        <input type="text" data-bind="value: ry"/> 
       </p> 
       <p> 
        <label>rz : </label> 
        <input type="text" data-bind="value: rz"/> 
       </p> 
       <p> 
        <label>s : </label> 
        <input type="text" data-bind="value: s"/> 
       </p> 
      </div> 
     </div> 
    </body> 
</html>

查看JS：

var _viewModel; 
var subscriptions = []; 

$(document).ready(function(){ 
    _viewModel = new Transform(); 
    ko.applyBindings(_viewModel); 
}); 

function makeObservable() { 
    var ob = ko.observable(0.0); 
    ob.subscribe(function (val) { 
     updateDocument(ko.toJSON(_viewModel)); 
    }); 
    return ob; 
} 

function Transform() { 
    this.__type__ = makeObservable(); 
    this.x = makeObservable(); 
    this.y = makeObservable(); 
    this.z = makeObservable(); 
    this.rx = makeObservable(); 
    this.ry = makeObservable(); 
    this.rz = makeObservable(); 
    this.s = makeObservable(); 
} 

function updateView(jsonDocument){ 
    var jsonDocument = JSON.parse(jsonDocument);   
    _viewModel.x(jsonDocument[ "x" ]); 
    _viewModel.y(jsonDocument[ "y" ]); 
    _viewModel.z(jsonDocument[ "z" ]); 
    _viewModel.rx(jsonDocument[ "rx" ]); 
    _viewModel.ry(jsonDocument[ "ry" ]); 
    _viewModel.rz(jsonDocument[ "rz" ]); 
    _viewModel.s(jsonDocument[ "s" ]); 
    _viewModel.__type__(jsonDocument[ "__type__" ]); 
}

感謝

來源

2013-07-22 Sam

您可以添加一個名爲silentUpdate禁用事件亨德勒場。

function makeObservable() { 
    var ob = ko.observable(0.0); 
    ob.subscribe(function (val) { 
     if(_viewModel.silentUpdate) return; 
     updateDocument(ko.toJSON(_viewModel)); 
    }); 
    return ob; 
} 


function Transform() { 
    this.silentUpdate = false; 
    ... 
} 

function updateView(jsonDocument){ 
    _viewModel.silentUpdate = true; 
    var jsonDocument = JSON.parse(jsonDocument);   
    _viewModel.x(jsonDocument[ "x" ]); 
    ... 
    _viewModel.__type__(jsonDocument[ "__type__" ]); 
    _viewModel.silentUpdate = false; 
}

我希望它有幫助。

來源

2013-07-22 11:00:06 Damien

非常感謝，這並不完全是我正在尋找的解決方案，但仍然很有效。 – Sam

Knockout observable訂閱

回答

相關問題