handlebars.js - Handlebars 显示 AJAX JSON 响应

问题描述

我是 handlebars.js 的新手，我正在尝试使用此 API https://yts.am/api/v2/list_movies.json显示 JSON 响应

我尝试使用静态和基本 JSON 数据，它可以正常工作，但是当我尝试加载大量数据时出现错误

<!DOCTYPE html>
<html>

<head>
    <title>Hello World</title>
</head>

<body>

    <h1 id="title"></h1>
    <hr>
    <div id="result"></div>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/3.0.1/handlebars.min.js"></script>


    <script id="text-template-yts" type="text/x-handlebars-template">
        <h2>{{title}}</h2>
        <h3>{{summary}}</h3>
        <ul>
        {{#each torrents}}
            <li><a href="{{url}}">{{quality}}</a></li>
        {{/each}}
        </ul>
      </script>

    <script>
        function ajax_get(url, callback) {
            var xmlhttp = new XMLHttpRequest();
            xmlhttp.onreadystatechange = function () {
                if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                    console.log('responseText:' + xmlhttp.responseText);
                    try {
                        var data = JSON.parse(xmlhttp.responseText);
                    } catch (err) {
                        console.log(err.message + " in " + xmlhttp.responseText);
                        return;
                    }
                    callback(data);
                }
            };

            xmlhttp.open("GET", url, true);
            xmlhttp.send();
        }

        ajax_get('https://yts.am/api/v2/list_movies.json', function (data) {
            document.getElementById("title").innerHTML = data["status_message"];

            var source = document.getElementById('text-template-yts').innerHTML;
            var template = Handlebars.compile(source);
            var html = template(data.data.movies);

            document.getElementById("result").innerHTML = html;
        });
    </script>


</body>

</html>

我能够获得查询成功，但解析错误

标签： handlebars.js

handlebars.js - Handlebars 显示 AJAX JSON 响应

问题描述

解决方案

推荐阅读