Привязка к списку нокаутов с флажком и ручкой щелчка

Question

Вот мой jsfiddle для иллюстрации: http://jsfiddle.net/hawaii/gN6CT/10/

У меня есть список объектов json, которые я хочу связать в ul с помощью шаблонов jquery, в каждом li у меня есть флажок для каждого элемента вместе с деталями элемента. Я хочу, чтобы это работало:

Когда пользователь нажимает на флажок, элемент будет обновлен в выбранный список (это работает)

Когда пользователь щелкает по деталям предметов, предмет будет выбранным, и я покажу все детали справа. Вот почему я помещаю детали предметов в элемент.

Как вы можете видеть из скрипки, она работает не так, как я хочу, привязка клика вызывается, даже когда viewModel впервые применяется, и когда я нажимаю на флажок, он также вызывает событие click .

Не могли бы вы, нокаут-гуру, помочь мне в этом? Спасибо

Answer 1

Я вижу несколько небольших вещей:

1 - вам не следует использовать привязку checked и value для одного и того же элемента.Привязка value будет прикреплять обработчики событий, как и привязка checked.В этом случае вы просто хотите убедиться, что атрибут value установлен, и не обрабатывать какие-либо события, поэтому вы можете сделать: checked:$parent.checkedPeople, attr: { value: Id }

2 - привязка клика ожидает ссылку на функцию, а нерезультат выполнения функции.Итак, вы проходили мимо: click: $parent.selectPerson(Id()).Это выполнит функцию во время привязки и попытается выполнить привязку к результату (что не будет эффективным, если результат на самом деле не является функцией).Альтернативой было бы сделать: click: function() { $parent.selectPerson(Id()); }.Однако в разметке некрасиво иметь анонимные функции, поэтому лучшим выбором будет просто сделать: click: $parent.selectPerson.Текущий $data будет передан в качестве первого аргумента, и вы можете прочитать Id из него.

Вот обновленная скрипка: http://jsfiddle.net/rniemeyer/gN6CT/11/