在applyBindings上敲击点击绑定

最近我已经把ViewModel分离到一个单独的JavaScript文件。

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

这里是HTML和Knockout相关的代码

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

HTML用户界面有一个button，点击数据绑定到视图模型中的预览function

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

在$（document）.ready（）函数中执行以下行时调用问题预览方法

 ko.applyBindings(Report, document.body); 

即没有用户点击预览button预览function被触发。 什么可能是这种行为的原因？ 当我在HTML页面中查看模型JavaScript时，整个工作都很好。

Answer 1

原因是，你的确在调用预览函数（因为编写functionName意味着引用函数，编写functionName()意味着调用它）。

所以data-bind="click: Report.preview"将按预期工作，但不交付参数。

正如手册所述（在不同的主题上，但这仍然适用）：

如果你需要传递更多的参数，一种方法是把你的处理程序包装在一个函数文字中，该函数需要一个参数，如下例所示：

 <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（）返回一个函数（实际上几乎是一样的）：

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

Answer 2

另一个解决scheme是使用“绑定”构造：

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

其中bind（）的第一个参数将成为被调用函数中的“this”。