applyBindings의 녹아웃 클릭 바인딩

Question

최근 ViewModel을 별도의 JavaScript 파일로 분리했습니다. 여기

var Report = (function($) { 
    var initialData = []; 
    var viewModel = { 
     reports: ko.observableArray(initialData), 
     preview: function(path) { 
      // preview report 
     }, 
     otherFunctions: function() {} 
    }; 
    return viewModel; 
})(jQuery);​ 

를 클릭 뷰 모델

<input type="button" name="Preview" id="Preview" class="btnPreview" 
    data-bind="click: Report.preview('url/to/report')" /> 

문제에 미리보기 기능으로 데이터 바인딩되는 HTML과 HTML 사용자 인터페이스는 버튼이

<script type="text/javascript" src="path/to/report/javascript"></script> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     ko.applyBindings(Report, document.body); 
    }); 
</script> 

녹아웃 관련 코드 미리보기 메서드는 $ (document) .ready() 함수에서 다음 줄을 실행할 때 호출됩니다.

ko.applyBindings(Report, document.body); 

사용자가 미리보기 버튼을 클릭하지 않으면 미리보기 기능이 실행됩니다. 이 행동의 이유는 무엇일까요? HTML 페이지 자체에서 모델 JavaScript를 볼 때 모든 것들이 잘 작동하고있었습니다.

Answer 1

이유는 실제로 당신이 미리보기 기능을 호출하고 있기 때문입니다. (왜냐하면 functionName 작성은 기능을 말하는 것이므로 functionName()은 그것을 호출하는 것을 의미합니다).

그래서 data-bind="click: Report.preview"은 예상대로 작동하지만 매개 변수를 넘겨주지 않습니다.

the manual으로 (다른 주제에,하지만 여전히 적용) 상태 : 그것을 할

더 많은 매개 변수를 전달해야하는 경우, 한 가지 방법에 걸리는 함수 리터럴에 핸들러를 포장하는 것입니다 이 예에서와 같이 매개 변수 :

<button data-bind="click: function(data, event) { myFunction(data, event, 'param1', 'param2') }"> 
    Click me 
</button> 

또는 귀하의 경우 :

data-bind="click: function() { Report.preview('url/to/report') }" 

또 다른 방법은 함수 (실제로는 거의 같은 것) 반환) (미리보기을하는 것입니다 :

preview: function(path) { 
    return function() { 
     // ... 
    } 
} 

Answer 2

또 다른 솔루션을 사용하는 것입니다 '를 바인드는'구성 :

data-bind="click: Report.preview.bind($data, 'url/to/report')" 

어디 처음 bind()에 대한 매개 변수는 호출 된 함수에서 'this'가됩니다.