Knockout.js 等于不参加淘汰赛
我在简单的淘汰应用程序中遇到了一些问题 型号:Knockout.js 等于不参加淘汰赛,knockout.js,knockout-mapping-plugin,Knockout.js,Knockout Mapping Plugin,我在简单的淘汰应用程序中遇到了一些问题 型号: function ContactListVM() { var self = this; self.selectedContact = ko.observable(""); self.contacts = ko.observableArray([]); self.LoadItems = function () { $.ajax({ url: "Contacts/GetCont
function ContactListVM() {
var self = this;
self.selectedContact = ko.observable("");
self.contacts = ko.observableArray([]);
self.LoadItems = function () {
$.ajax({
url: "Contacts/GetContactList/",
type: "POST",
data: { },
success: function (data) {
$.each(data.Contacts, function () {
self.contacts.push(ko.mapping.fromJS(this));
});
if (self.selectedContact() == "") {
var data = new Object();
data.ID = self.contacts()[0].ID;
self.selectContact(data, null);
}
}
});
}
self.LoadItems();
self.selectContact = function (data, event) {
$.ajax({
url: "Contacts/GetContact/",
type: "POST",
data: { ID: data.ID },
success: function (data) {
self.selectedContact(ko.mapping.fromJS(data.Contact));
}
});
}
}
因此,一般来说,我有一个非常基本的信息和选定联系人的完整模型的联系人列表。所选联系人应在列表上标记为不同的css类别:
<ul class="contact-list">
<!-- ko template: { name: 'item-template', foreach: contacts() } -->
<!-- /ko -->
<script id="item-template" type="text/html">
<li class="item" data-bind="click: $root.selectContact, css: { selected: $root.selectedContact().ID == ID() }">
<span class="contact-name" data-bind="text: Name"></span>
<span class="contact-name" data-bind="text: $root.selectedContact().ID"></span>
<span class="contact-name" data-bind="text: ID()"></span>
</li>
</script>
</ul>
-
不幸的是,css:{selected:$root.selectedContact().ID==ID()}语句不起作用。未选择任何项目。在下面的几行中,我将这些值绑定到屏幕上显示相等的跨距。我如何解决这个问题?
问题是,在选择联系人之前,selectedContact()为空,因此没有方法ID。您需要在逻辑中添加一条附加语句
<script id="item-template" type="text/html">
<li class="item" data-bind="click: $root.selectContact, css: { selected: $root.selectedContact() ? $root.selectedContact().ID() === ID() : false }">
<span class="contact-name" data-bind="text: Name"></span>
<span class="contact-name" data-bind="text: $root.selectedContact().ID"></span>
<span class="contact-name" data-bind="text: ID()"></span>
</li>
</script>
不幸的是,现在我收到“Message:objecthasnotmethod'ID'”,视图(模板)中的绑定是否可能是在我的模型中设置selectedContact之前进行的?如果是这样的话,应该怎么做呢?啊,那么你的ID不是一个可观察的属性。我只是回顾了一下,你们在哪里分配了那个属性,实际上它是不可见的。你能告诉我在映射后联系人是否是可观察的吗?如果您选择console.log selectedContact,它是将ID显示为一个函数还是一个值?看起来ID是一个函数-奇怪<代码>ID:函数可观察()
if ($root.selectedContact() !== (undefined or null))
{
if ($root.selectedContact().ID() === ID())
{
set class = selected;
}
else { don't set a class }
}
else { don't set a class }