Können Knockout.js-Bindungen sowohl für Container-Tags als auch für Nachkommen gelten?

Lassen Sie mich die Frage mit einem einfachen Fall einrichten.

Ich habe eine HTML-Tabelle, deren Zeilen von einem observableArray gesteuert werden. Es funktioniert großartig.

Wenn das observableArray jedoch keine Elemente enthält, möchte ich, dass dies in einer einzelnen Zeile angegeben wird. Ich habe dieses Markup ausprobiert, was "irgendwie" funktioniert:

<tbody data-bind="if: $root.data.contacts().length == 0">
    <tr>
        <td>There are no contacts specified yet.</td>
    </tr>
</tbody>

<tbody data-bind="foreach: $root.data.contacts">
        SNIP - a tbody with the rows is here when elements > zero
</tbody>

Wenn ich "Art" sage, meine ich SICHTBAR. Es zeigt sich wirklich bei null Elementen und verschwindet wirklich bei> null Elementen, so wie Sie es erwarten würden. Wenn Sie jedoch den DOM-Inspektor (Entwicklungswerkzeuge) öffnen und das DOM im Speicher anzeigen, werden Sie feststellen, dass es ZWEI @ gib tbody Abschnitte, nicht einer. Jetzt eins tbody ist natürlich immer leer, abertwo tbody tags ist nicht HTML5 korrekt, daher muss dies behoben werden Dies ist nicht der gewünschte Aufschlag.

ls Knockout-Neuling habe ich versucht, dieses Problem mit einem virtuellen Element zu beheben:

<!-- ko if: $root.data.contacts().length == 0 -->
<tbody>
    <tr>
        <td>There are no contacts specified yet.</td>
    </tr>
</tbody>
<!-- /ko -->

Leider funktioniert dies nicht für unseren Erstellungsprozess: Wir minimieren HTML vor der Komprimierung und Kommentare werden entfernt.

Ich hatte den Eindruck, dass KO-Bindungen sowohl für das CONTAINER ELEMENT SELBST als auch für Nachkommen gelten, aber dies scheint nicht so zu sein. Gibt es eine Möglichkeit, KO anzuweisen, sowohl auf Containerelemente als auch auf untergeordnete Elemente anzuwenden, oder muss ich das Markup auf eine andere Weise ändern als bei einem virtuellen Container?

Antworten auf die Frage(4)

Ihre Antwort auf die Frage