2013-12-13 6 views
3

관찰 가능한 객체 중 하나에 구독 함수가 있습니다. 구독 함수는 관찰 가능 객체에 대한 변경이있을 때만 실행해야한다고 가정합니다. 코드를 추적 할 때 초기화시 ko.applyBindings(MyViewModel);을 호출 한 후에 코드가 실행되고 있음을 알 수 있습니다.ko.applyBindings (...) 내 knockout js subscribe 함수 (관찰 가능)가 실행 중입니다.

function MyViewModel(myModel){ 
    this.myProperty = ko.observable(myModel.myProperty); 

    this.myProperty .subscribe(function (val) { 
     // do sth.. 
    }, this); 
} 

내가 applyBindings로 전화 할 곳이다 : 여기

나는 나의 뷰 모델에 무엇을 가지고있다

jQuery(document).ready(
    function ($) { 
     ko.applyBindings(MyViewModel); 
}); 

이 예상되는 동작입니다을?

ko.applyBindings(MyViewModel); 바로 뒤에 subscribe 함수가 호출됩니다. 즉, UI에서 입력을받지 못했습니다.

myProperty 값이 변경 될 때마다 내 구독 기능 본문 만 실행하도록하고 싶습니다. 관찰 할 수있는 객체를 추적하여 어디에서 변화가 일어나는지 확인할 수있는 방법이 있습니까?

+4

구독은 값이 변경 될 때만 실행됩니다. 값을 쓰는 바인딩에서 applyBindings 동안 값을 변경할 수 있습니다. 'value' 바인딩을 사용하여'select'에 속성을 묶고 문자열로 업데이트되는 초기 숫자 값을 가지게됩니까? –

+0

@RPNiemeyer : 유용한 의견을 보내 주셔서 감사합니다. 서브 스크립 션은 실제로 백엔드 코드에서 발생하는 일부 변경으로 인해 초기화 후 호출되었습니다. 언급 한 것처럼 – r2d2oid

답변

5

구독을 설정하면 ko.applyBindings()를 호출 할 때 구독이 평가되고 트리거됩니다.

변경 내용 추적 만보고있는 경우 계산 된 관찰 가능을 사용하여 동일한 결과를 얻을 수 있습니다. {deferEvaluation : TRUE}이()를 추가하여 당신이 ko.applyBindings 평가되는 계산 된 관찰을 연기 할 수처럼 보이는 옵션은 다음과 같습니다 :

function MyViewModel(myModel){ 
     this.myProperty = ko.observable('someValue'); 
     this.runCode = ko.computed(function (val) { 
      // do some stuff any time this.myProperty() is changed 
      console.log(this.myProperty()); 
     }, this, {deferEvaluation: true}); 
    } 

var vm = new MyViewModel(); 

ko.applyBindings(vm); 

vm.runCode(); 

vm.myProperty('some new value2'); 

이 기본 동작을 방지 할 수 있습니다 : 예를 들어

코드가 평가 될 때 실행되도록해야합니다. 이벤트 추적을 시작하려면 추적을 시작하려고 할 때 계산 된 (이 경우에는 vm.runCode())을 호출해야합니다. Heres는

동작을 보여줍니다 업데이트 된 바이올린 : http://jsfiddle.net/amspianist/SL22M/2/

+0

도 초기화시 한 번 실행됩니다. 그래서 그것은 내 문제를 해결하지 못할 것이다. 그래도 고마워! – r2d2oid

+0

문제 없습니다. 나는 이것이 녹아웃을위한 정상적인 행동이라는 것을 설명하기위한 것이었다. 최근 프로젝트에서이 문제에 부딪혔습니다. 기본적으로 jQuery와 함께 변경 이벤트 처리기를 연결하는 함수를 만들어야했습니다. 입력/양식 요소의 변경 사항을 추적하려고합니까? 아니면 다른 JavaScript 객체 속성입니까? –

+1

@JoshTaylor 당신은'ko.computed (fn, this, {deferEvaluation : true})'와 같이 계산 결과에'deferEvaluation'을 사용할 수 있습니다. 이게 여기서 도움이되지 않을까요? – janfoeh

2

당신이 당신의이 같은 바인딩의 객체를 참조하고 있습니까? 당신이 기능이 바인딩에서 호출되는 것처럼 얘기하는 문제를 줄 수도

<div data-bind="text: myProperty"></div> 

:

<div data-bind="text: myProperty()"></div> 

에 반대.