1

我有一个 Web API，它成功地返回了 JSON 格式的博客文章数组：

[{"ID":1,"Title":"First Blog Post","Body":"Some Content"},{"ID":2,"Title":"Second BlogPost","Body":"Some other content"}]

出于练习目的，我想使用 Knockout.js 在列表中显示所有帖子。

这是我的代码：

<script>
$(document).ready(function () {

    function AppViewModel() {
        var self = this;

        self.posts = ko.observableArray([
        { Title: 'Default Title', Body: 'Default Body' },
        ]);

        $.getJSON('api/posts', function (data) {
            ko.mapping.fromJSON(data, {}, self.posts);
        });

    }

    ko.applyBindings(new AppViewModel());

});

我的绑定：

<tbody data-bind="foreach: posts">
                <tr>
                    <td data-bind="text: Title"></td>
                    <td data-bind="text: Body"></td>
                </tr>
</tbody>

我的表显示为空，由于某种原因它没有显示 JSON 数据......

回答：我必须将 fromJSON 更改为 fromJS 并且它有效！非常感谢大家的帮助

4

2 回答 2

0

返回的 json 具有标题大小写的属性名称，但 self.posts 中的原始属性名称具有小写的属性名称。我假设您绑定到模板中的小写版本。考虑将返回的 json 也更改为小写。

于 2012-08-18T21:52:00.613 回答
0

在您的情况下，您需要为映射指定更新目标。

来自Knockout Mapping 插件文档：

如果像上面的示例一样，您在类内部执行映射，您希望将其作为映射操作的目标。ko.mapping.fromJS 的第三个参数表示目标。例如，

ko.mapping.fromJS(data, {}, someObject);

所以在你的情况下：

$.getJSON('api/posts', function (data) {
        ko.mapping.fromJSON(data, {}, self.posts);
    });

一个工作的JSFiddle

另请注意，属性名称区分大小写，它们应在 JSON 以及您的视图模型和绑定中匹配。例如，您检索"Title"但您正在使用title

于 2012-08-18T21:55:28.747 回答