Knockout：使用数据绑定属性在label标签中嵌套输入元素

Question

我想使用label代码而不将for属性映射到input的{​​{1}}，如w3c所述。像：

id

现在我尝试使用淘汰赛。

我的模特：

<label>
    <input type="...">
</label>

我的第一个方法是：

function myViewModel(data) {
    this.Name = "Max";
    this.Value = "1337";
}

但当然<label data-bind="text: Name"> <input data-bind="value: Value" /> </label> 的数据绑定会覆盖其内容。因此，label不会出现。

演示：https://jsfiddle.net/f49c32zx/

问题：如何才能完成这项工作？

我没有尝试将整个input元素与所有属性和值一起作为我模型属性的值 - 这并没有给我一个好的感觉。

Answer 1

您可以在标签标签内放置span或虚拟标签，并将文本绑定放在该内部标签上。

<label>
    <!-- ko text: Name --><!-- /ko -->
    <input data-bind="value: Value" />
</label>

Answer 2

<label> <!-- ko text: Name --><!-- /ko -->
    <input data-bind="value: Value" />
</label>