淘汰赛映射阅读JSON(Knockout Mapping reading JSON)

只是淘汰赛映射开始阅读一些JSON（使用谷歌图书API），但似乎无法得到它的工作。没有错误报告，但不会显示任何内容。可能是一个简单的问题，我忽略了，但感谢的审查。

标记....

<body>
<h2>Find Cat in the Hat</h2>
   <div>
        <input id="booksearch" />
    </div>
    <div>
        <table>
            <thead>
                <tr>
                    <th>Volumes</th>
                </tr>
            </thead>
            <tbody data-bind="foreach: model.items">
                <tr>
                    <td data-bind="text: model.id"></td>
                </tr>
            </tbody>
        </table>
    </div>
    <input id="btnTest" type="button" value="button" />
</body>
<script src="/Scripts/jquery-1.8.2.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script src="/Scripts/knockout-2.2.0.js"></script>
<script src="/Scripts/knockout.mapping-latest.js"></script>

jQuery的....

$(document).ready(function () {
    //Knockout Test

    $('#btnTest').click(function () {
        var url = "https://www.googleapis.com/books/v1/volumes?q=the+Cat+In+The+Hat";

        var viewModel = {};
        $.getJSON(url, function (data) {
            viewModel.model = ko.mapping.fromJSON(data);
            ko.applyBindings(viewModel);

        });
    });
});

在$.getJSON成功回调，你会得到一个JavaScript对象不是一个JSON字符串：

成功回调被传递返回的数据，其通常是JavaScript对象或阵列由JSON结构所定义和使用$ .parseJSON（）方法解析 。它也通过了响应的文本状态

所以，你需要使用ko.mapping.fromJS(data); 方法，而不是ko.mapping.fromJSON(data);

你的固定代码应该是这样的：

$.getJSON(url, function (data) {
    viewModel.model = ko.mapping.fromJS(data);
    ko.applyBindings(viewModel);
});

你也有另外一个问题在您的视图： data-bind="text: model.id"应该是data-bind="text: id"你并不需要的model那里，因为里面foreach你是在上下文model.items ：

<tbody data-bind="foreach: model.items">
    <tr>
        <td data-bind="text: id"></td>
    </tr>
</tbody>

演示的jsfiddle 。

淘汰赛映射阅读JSON(Knockout Mapping reading JSON)

Answer 1:

收藏的人(0)

淘汰赛映射阅读JSON(Knockout Mapping reading JSON)

Answer 1:

收藏的人(0)

举报内容

检举类型

检举原因

检举说明(必填)

打开微信“扫一扫”，打开网页后点击屏幕右上角分享按钮