KnockOutJs:为什么点击数据绑定会执行元素的加载

Question

我有一个通过php生成的锚链接，它将绑定在ko上并且工作正常。我的问题是为什么 ko 函数在元素加载时执行？下面是生成的代码。

.html：

<a data-bind="click: addOrderedProducts(11,"CRM130930001","Cream",0.00,0,0,0)" class="Add" title="Add" href="">Add</a>

KO功能：

self.addOrderedProducts = function (id,product_number,name,price,quantity,discount,balance){
    self.orderedProducts.push(new Product(id,product_number,name,price,quantity,discount,balance));
};

请帮帮我...提前致谢:)

Answer 1

这就是对象文字在 Javascript 中的工作方式，因此在创建对象时会立即计算属性值(如函数类(。

要使其正常工作，您需要将click绑定中的函数调用包装到匿名函数中：

<a data-bind="click: function () { addOrderedProducts( ... ) }" href="">Add</a>

另请参阅文档中：访问事件对象或传递更多参数

Answer 2

或者

，您可以使用我认为稍微干净一点的...click: addOrderedProducts.bind($data,...)(尽管这有点个人品味问题(。

bind 是 function 对象的 ES5 方法(Knockout 填充它(返回一个新的匿名函数，当调用该函数时，将从第一个参数获取其上下文(即其this值(bind以及从传递给bind的任何其他参数获取其前几个参数(。

顺便说一句(虽然这里没有人这样做(值得一提的是，永远没有必要写这样的东西：

functionWithCallback(..., function(data) {
  someOtherFunction(data);
});

相反，你可以只写

functionWithCallback(..., someOtherFunction);

函数

的名称与匿名函数表达式一样是函数引用;没有必要为了获得一个而编写后者(当然，如果回调涉及的代码不仅仅是单个函数调用，则确实需要一个匿名函数(。

Answer 3

来自官方文档：

<button data-bind="click: myFunction.bind($data, 'param1', 'param2')">Click me</button>