我在 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>