数据绑定的 h1 标记未显示 (knockoutjs)答案

【问题标题】：Data-bound h1 tag not showing up (knockoutjs)数据绑定的 h1 标记未显示 (knockoutjs)
【发布时间】：2012-10-12 14:47:20
【问题描述】：

我在 KO 中有一个简单的视图模型：

        function TemplateFile(name, fileName) {
            var self = this;
            self.name = name;
            self.fileName = fileName;
        }

        var layoutViewModel = {
            loggedInUser: ko.observable("user"),
            templateFiles: ko.observableArray([
                // some initial entries...
            ]),
            contentHeading: ko.observable("Content"),
            // some other things...
        };

        $(function () { ko.applyBindings(layoutViewModel); });

并且数据绑定在我的 _Layout.cshtml 局部视图中的各个点，其中大部分工作正常。除了这个……

        <!-- Page content -->
        <div class="container-fluid" 
             style="background-color: white; border-radius: 10px; margin: 20px; min-height: 400px; height: auto !important; height: 400px">
            <div class="row-fluid">
                <div class="span12">
                    <h1 data-bind="text: contentHeading" style="color: darkgray;" />
                </div>
            </div>
            <div class="row-fluid">
                <div class="span12">
                    @RenderBody()
                </div>
            </div>
        </div>

（忽略内联 CSS，很快就会修复；））

绑定到 h1 的“contentHeading”数据根本没有显示出来。我已经尝试了几件事...

切换出正在绑定的数据：仍然没有显示
将标签移动到页面的不同部分：一些有效，一些随机无效
硬编码一个虚拟文本值：这个 DID 显示出来

因此，鉴于这些结果，我认为某些 DOM 元素的加载方式可能存在问题，可能是因为我使用的是 Twitter Bootstrap？

我在这里不知所措，似乎无法从其他人那里找到类似的问题。有什么建议吗？

<ul class="dropdown-menu" data-bind="foreach: templateFiles">
    <li>
        <a href="#" data-bind="attr: { title: fileName}" />
        <span data-bind="text: name" />
    </li>
</ul>

【问题讨论】：

我可以确认淘汰赛在 bootstrap 上工作正常我自己正在使用它......但我不太确定为什么上面的代码不起作用它看起来对我来说没问题。它是否给出任何错误.你能做个小提琴吗？
我之前没有真正使用过 jsFiddle，所以我只是把我放在这里的代码扔进去了......如果这不是我应该做的，请告诉我！ jsfiddle.net/mV6KQ
我猜代码中的上下文有问题。您确定没有将 H1 withing 或 foreach 绑定放在一起吗？
我实际上确实有一个更远的foreach，我认为它已正确关闭...也许不是？帖子已编辑以反映它是什么
天啊！我现在看到了这个问题。它甚至与淘汰赛或引导程序无关。我只是没有按顺序排列我的标签。 -_-

标签： asp.net-mvc html twitter-bootstrap knockout.js

【解决方案1】：

<ul class="dropdown-menu" data-bind="foreach: templateFiles">
    <li>
        <a href="#" data-bind="attr: { title: fileName}" />
       <span data-bind="text: name" />
  </li>
</ul>

这甚至与淘汰赛或引导程序无关。我只是标签不匹配。哦。

结束这个问题！感谢您提供有关查找内容的提示:)

【讨论】：