1

我是 knockout.js 的新手，需要对如何使用 json 数据简单地更新表单字段有一个非常基本的了解。我有一个视图模型。如何将 json 数据拉入可观察字段？

<p>Errors: <input data-bind="value: errors" /></p>
<p>Message: <input data-bind="value: message" /></p>

// Here's my data model
var ViewModel = function(myError, myMessage) {
    this.errors = ko.observable(myError);
    this.message = ko.observable(myMessage);
};

ko.applyBindings(new ViewModel("Planet", "Earth")); // This makes Knockout get to work

$.getJSON("http://api.twitter.com/1/statuses/public_timeline.json", function(data) {

})
4

1 回答 1

1

我更喜欢显式地设置视图模型属性——我觉得这样更容易控制和维护。

var ViewModel = function(myError, myMessage) {
    var self = this;
    self.errors = ko.observable(myError);
    self.message = ko.observable(myMessage);
    self.property1 = ko.observable();
    self.property2 = ko.observable();
};

var vm = new ViewModel("Planet", "Earth");
ko.applyBindings(vm); // This makes Knockout get to work
$.getJSON("http://api.twitter.com/1/statuses/public_timeline.json", function(data) {
    vm.property1(data.field1);
    vm.property2(data.field2);
    ...etc
})

如果这看起来太冗长，还有一个映射插件，您可以使用它来自动将 JSON 中的值映射到您的视图模型中。

在此处阅读更多信息：http: //knockoutjs.com/documentation/plugins-mapping.html

var vm = new ViewModel("Planet", "Earth");
ko.applyBindings(vm); // This makes Knockout get to work
$.getJSON("http://api.twitter.com/1/statuses/public_timeline.json", function(data) {
    var jsObject = ko.fromJSON(data);
    ko.mapping.fromJS(jsObject , viewModel);
})
于 2013-04-30T18:03:46.123 回答