KnockOutJs: Почему функция click-bind имеет возможность выполнить загрузку элемента?

У меня есть якорная ссылка, сгенерированная через 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));
};

Пожалуйста, помогите мне... Спасибо заранее:)

Ответ 1

Это то, как объектные литералы работают в Javascript, поэтому значения свойств, такие как класс функций, сразу оцениваются при создании объекта.

Чтобы сделать это, вам нужно обернуть вызов функции в привязке click в анонимную функцию:

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

См. также в документации: Доступ к объекту события или передача большего количества параметров

Ответ 2

В качестве альтернативы вы можете использовать ...click: addOrderedProducts.bind($data,...), который, по моему мнению, немного чище (хотя это немного зависит от личного вкуса).

bind - это метод ES5 (нокаут затыкает его для браузеров, не относящихся к ES5) объектов function, которые возвращают новую анонимную функцию, которая при вызове примет свой контекст (т.е. его значение this) из первый аргумент bind и его первые несколько аргументов из любых дополнительных аргументов, переданных в bind).

BTW (хотя никто этого не делал) стоит упомянуть, что никогда не нужно писать что-то вроде:

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

Вместо этого вы можете просто написать

functionWithCallback(..., someOtherFunction);

Имя функции является такой же ссылкой на функцию как выражение анонимной функции; нет необходимости писать последнее, чтобы получить один (конечно, вам нужна анонимная функция, если обратный вызов включает в себя больше кода, чем только один вызов функции).