敲除不绑定多个跨度?

时间:2014-08-26 15:27:06

标签: javascript html knockout.js

我正在使用knockout.js将我的视图模型绑定到我的视图中。

奇怪的是,绑定似乎不能正常工作,我不知道为什么。

<table class="matches" data-bind="visible: matches().length > 0">
        <thead>
            <tr>
                <th>Customer Details</th>
                <th>Customer Details 2</th>
            </tr>
        </thead>
        <tbody data-bind="foreach: matches">
            <tr data-bind="click: $root.goToCustomerMatching">
                <td data-bind="with: customer">
                    <p>
                        <b data-bind="text: description" />
                        <span data-bind="text: addressLine1" /><br />
                        <span data-bind="text: addressLine2" /><br />
                        <span data-bind="text: addressLine3" /><br />
                        <span data-bind="text: addressLine4" /><br />
                        <span data-bind="text: postcode" /><br />
                        <i>(<span data-bind="text: customerAccountNumber" />)</i>
                    </p>
                </td>
                <td data-bind="with: match">
                    <p>
                        <b><!--ko text: customerCode--><!--/ko--></b><br />
                        <span data-bind="text: addressLine1" /><br />
                        <span data-bind="text: addressLine2" /><br />
                        <span data-bind="text: addressLine3" /><br />
                        <span data-bind="text: addressLine4" /><br />
                        <span data-bind="text: addressLine5" /><br />
                        <span data-bind="text: postcode" /><br />
                        <span data-bind="text: domain" />
                    </p>
                </td>
            </tr>
        </tbody>
    </table>

matchesobservableArray

第一个绑定有效,并显示说明(两次!?) 其余的绑定失败,甚至没有生成HTML。

但是,当使用无容器标记(html注释)进行第一次绑定时,第一个和第二个绑定可以正常工作。您可以在第二列中看到这一点。

Screenshot

我真的不明白为什么会发生这种情况,而且我不想让所有东西都使用无容器标记,所以任何想法都会感激不尽!

1 个答案:

答案 0 :(得分:0)

我仍然不知道为什么这是一个问题,因为我发现这个解决方案的唯一参考是与旧版IE上的空白无关的问题。我在Chrome和Firefox上进行了测试,所以......

我发现使用明确打开和关闭的标签有效。 E.g。

<b data-bind="text: description"></b>

工作,但

<b data-bind="text: description"/>

没有

关于为什么会受到赞赏的任何线索:)