1

我对淘汰赛还很陌生，并试图了解一些绑定应该如何工作。

我认为我可以在不需要 with 的情况下在正常绑定中引用一个可观察的子对象，但我无法让它工作。

我的模型和视图模型是；

        Model = function(name) {
            this.name = ko.observable(name);
        };

        ViewModel = function () {


            var list = ko.observableArray([new Model("Apple"), new Model("Pear")]),
                selectedItem = ko.observable();

            function selectItem(item) {
                selectedItem(item);
            }

            return {
                list: list,
                selectedItem: selectedItem,
                selectItem: selectItem
            };
        };

这是绑定：

        <div id="content">
        <ul id="list" data-bind="foreach: list">
            <li data-bind="text: name, click: $parent.selectItem"></li>
        </ul>
    </div>

    <p>Will show selected item</p>
    <div data-bind="with: selectedItem">
        <span data-bind="text: name"></span>
    </div>
    <div>
        <p>Won't show selected item</p>
        <span data-bind="text: selectedItem().name()"></span>
    </div>

或者，这里有一个工作小提琴。

据我了解，我应该能够看到一个值，selectedItem().name但应用绑定会引发错误，但是如果 div 具有with: selectedItem绑定，它可以完美地工作。

我没有选择，只能with在这种情况下使用绑定吗？

4

1 回答 1

2

设置绑定上下文旁边的with弯曲还处理值为null或的情况undefinied。

从文档

如果您提供的表达式计算结果null或undefined 后代元素根本不会被绑定，而是会从文档中删除。

如果您不想使用，则with必须“手动”处理nullorundefinied案例，因此您只能name()在selectedItem()返回的内容时调用。

这可以通过语句来完成selectedItem() && selectedItem().name()。( null, 空字符串并undefinied评估为falseevertying else is to true.)

所以下面的绑定是有效的：

<span data-bind="text: selectedItem() && selectedItem().name()"></span>

演示JSFiddle。

于 2013-05-02T17:44:41.110 回答