В моем HTML я могу определить эти привязки для нокаута foreach:
<!-- ko foreach: customer -->
<div data-bind="text: id" />
<!-- /ko -->
против
<div data-bind="foreach: customer">
<div data-bind="text: id" />
</div>
Где различия между этими двумя подходами?
Используйте встроенное связывание, когда отношения между родителями и дочерними элементами существуют в секции привязки, такие как ul и li.
Используйте синтаксис комментария для привязки к контейнеру, если раздел привязки не имеет отношения родитель-потомок.
В вашем примере вы используете первый блок кода, потому что вы не пытаетесь связать его с дочерней структурой. Все, что вы хотите сделать, это просто привязать данные вашего клиента к div, вам не нужно создавать родительский div и foreach через клиентов и добавлять другой div внутри родительского div. Это больше, чем вы хотите.
Хорошее использование безмасляной привязки
<!-- ko foreach: customer -->
<section>
<p data-bind="text: customer.name"></p>
<p data-bind="text: customer.orderDate"></p>
</section>
<!-- /ko -->
Однако, если у вас есть упорядоченный список, вы должны использовать собственную привязку, потому что это имеет смысл.
Native
<ol data-bind="foreach: customer">
<li data-bind="text: customer.name"></li>
</ol>
Containerless
<ol>
<!-- ko foreach: customer -->
<li data-bind="text: customer.name"></li>
<!-- /ko -->
</ol>
Второй пример выглядит глупо. Вы добавляете больше сложности для чего-то, что не должно быть сложным.
В некоторых случаях вам может понадобиться дублировать раздел разметки, но у вас нет какого-либо элемента контейнера, на котором можно привязать привязку foreach
Чтобы справиться с этим, вы можете использовать синтаксис потока управления без контейнера, который основан на тегах комментариев
Детали режима на привязка "foreach" , Примечание 4: Использование foreach без элемента контейнера