2013-07-22 4 views
0

우리는 HTML 프론트 엔드 (주로보기)와 파이썬 백엔드 (주로 문서)를 사용하여 데스크탑 응용 프로그램을 개발하고 있습니다.녹아웃 관측 가능 구독

입력 요소를 사용하여 문서가 업데이트됩니다. 뷰가 업데이트되어 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__" ]); 
} 

감사

답변

0

당신은 이벤트 헨들러를 사용하지 않도록 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; 
} 

도움이되기를 바랍니다.

+0

고마워, 내가 찾던 해결책이 아니지만 여전히 효율적이다. – Sam