我已经看到了几个与此相关的问题,但我仍然无法弄清楚我在这里做错了什么。
我想做的是获取从服务器返回的 JSON 对象,如下所示:
{
"firstname": "Blanchard",
"lastname": "Buckner",
...
}
View 模型执行 AJAX 调用,并且数据似乎设置正确。但是当我尝试将其传递到 singleContact 函数以绑定(bind)到 View 时,什么也没有发生。
我是 knockout 新手,所以我确信我犯了一个非常简单的错误,但我已经尝试了一段时间来解决这个问题,但没有任何效果。
// Binds json db data to each contact.
function singleContact(data) {
var self = this;
self.firstName = data.firstname;
self.lastName = data.lastname;
self.fullName = ko.computed(function() {
return self.firstName + " " + self.lastName;
}, self);
self.image = data.image;
self.position = data.position;
self.company = data.company;
};
function detailViewModel(contactID) {
var self = this;
self.contactID = ko.observable(contactID);
self.contact = ko.observableArray([]);
self.getContact = function(id) {
$.ajax({
type: 'GET',
url: 'http://localhost:3000/contacts/' + id,
dataType: 'json',
success: function(data) {
console.log(singleContact(data)); <---- Always Undefined. The data is a JSON object.
}
});
}
self.getContact(self.contactID());
};
编辑: 这是标记,应该在第一次时就包含在内。
<!-- ko foreach: contact -->
<img class="contact__image" data-bind="attr:{src: image, alt: fullName}" />
<h1 data-bind="text: fullName"></h1>
<h2>
<span data-bind="text: position"></span>,
<span data-bind="text: company"></span>
</h2>
<h5>Notes on <span data-bind="text: fullName"></span></h5>
<p></p>
<!-- /ko -->
最佳答案
您需要使用new
关键字来创建一个singleContact对象:
var contact = new singleContact(data);
然后可以将其分配给detailViewModel上的可观察对象:
self.singlecontact(contact);
我还建议您使用大驼峰命名法作为 viewModel。 IE。 DetailViewModel
而不是 detailViewModel
,就像使用面向对象编程时在任何其他语言中一样。
关于javascript - Knockout.js - 尝试将 JSON 添加到 View 模型未定义,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31466856/