淘汰赛 foreach 绑定不解析嵌套元素

Question

情况比较简单。我有一个对象列表，我想将它们呈现在一个无序列表中，每个列表项都包含一个链接。出于某种原因，KO 绑定没有解析我的列表项中的项。首先，这是一个小提琴：

http://jsfiddle.net/internetH3ro/z4PBT/

HTML 相当简单：

<ul data-bind="foreach: vm.MenuItems">
    <li data-bind="css: CssClass">
        <a data-bind="text: LinkText, attr: { href: Href }" />
    </li>
</ul>

这是最小的 JS：

var ViewModel = (function () {
    function ViewModel(json) {
        var self = this;
        self.vm = ko.mapping.fromJS(json);
    };

    return ViewModel;
})();

var json = {
    MenuItems: [{
        LinkText: "Item 1",
        Href: "http://www.google.com",
        CssClass: "active"
    },{
        LinkText: "Item 2",
        Href: "http://www.yahoo.com",
        CssClass: "inactive"
    },{
        LinkText: "Item 3",
        Href: "http://www.microsoft.com",
        CssClass: "inactive"
    }]
};

var vm = new ViewModel(json);
ko.applyBindings(vm);

我得到的错误是当它尝试绑定到锚标记时，没有一个绑定正在解析。

“未捕获的引用错误：无法处理绑定”文本：函数 (){return LinkText }" 消息：未定义 LinkText"

我怀疑它与 LI 元素上的绑定有关，但我删除了它，它仍然失败，即使认为绑定工作得很好。我以前使用过 Knockout，这应该不是那么难，但我无法完全弄清楚这一点。

Answer 1

我想我找到了问题所在。 Knockout 不会重写你的

<a data-bind="text: LinkText, attr: { href: Href }" /> 

标签应该写成

<a data-bind="text: LinkText, attr: { href: Href }"> </a> 

使其成为有效的 HTML 并能够像

一样将文本节点注入其中

<a data-bind="text: LinkText, attr: { href: Href }">
    *the value of LinkText here* 
</a> 

See this Fiddle