KnockOutJs:为什么click data-bind执行元素的on-load？

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是一个ES5方法(Knockout为非ES5浏览器填充它),function它返回一个新的匿名函数,当被调用时,它将this从第一个参数获取其上下文(即其值),bind并从任何其他参数获取其前几个参数传递给bind).

顺便说一句(虽然没有人在这里做过)​​,值得一提的是,从来没有必要写下这样的东西:

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

相反,你可以写

functionWithCallback(..., someOtherFunction);

函数的名称是尽可能多的功能引用作为匿名函数表达的; 没有必要编写后者以获得一个(当然,如果回调涉及的代码多于单个函数调用,则需要一个匿名函数).