在 API 中调用 API - jQuery/Handlebars答案

【问题标题】：Calling API within API - jQuery/Handlebars在 API 中调用 API - jQuery/Handlebars
【发布时间】：2013-08-31 18:15:35
【问题描述】：

我正在尝试调用两个 Reed 工作站点 API，一个是搜索按雇主 ID 列出的所有工作，第二个是检索在初始搜索中找到的所有工作 ID 的数据。数据从第一次 API 调用开始就很好，我可以使用把手将相关数据放到页面上，没有问题。第二个 API 将调用并且数据在 JS 控制台中可见，但是当它放置在页面上时，控制台显示“无法读取未定义的属性 'jobTitle'”。我知道这一定很简单，但我对 JS/API 的世界还比较陌生，所以可以用手来做！

这是我的 html

            <div id="results">


                <table>
                    <tbody>

                        <script id="reedsearch-template" type="text/html">
                            <tr>
                                <th>{{ jobTitle }}</th>
                                <td>{{ locationName }}</td>
                                <td>£{{ minimumSalary }} - £{{ maximumSalary }}</td>
                                <td>{{ jobUrl }}</td>
                            </tr>

                        </script>


                    </tbody>


                </table>
            </div>

这是我的 JS（删除了我的 API 密钥）

$(document).ready(function () {


var reedsearchHtml = $("#reedsearch-template").html();
var reedsearchTemplate = Handlebars.compile(reedsearchHtml); 



    $.ajax({
        type: "get",
        async: true,
        url: "http://www.reed.co.uk/api/1.0/search?employerId=p8799",
        beforeSend: function(xhr) {
            xhr.setRequestHeader("Authorization", "Basic " + btoa("API KEY:"))
        },
        success: function (data) {

            console.log(data.results);

            for (var i = 0; i < data.results.length; i++) {
                var job = data.results[i];
                var jobHtml = reedsearchTemplate(job);
                $("#results").append(jobHtml);

                    var reedUrl = "http://www.reed.co.uk/api/1.0/jobs/";
                    var id = job.jobId
                    var url = reedUrl + id;

                    $.ajax({
                        type: "get",
                        async: true,
                        url: url,
                        beforeSend: function(xhr) {
                            xhr.setRequestHeader("Authorization", "Basic " + btoa("API KEY:"))
                        },
                        success: function (data) {

                            console.log(data);

                            var jobDetails = data.results;
                            var detailsHtml = reedsearchTemplate(jobDetails);
                            $("#results").append(detailsHtml);
                        }
                    });



            }
        }

    });

});

请温柔一点，提前谢谢:)

【问题讨论】：

你应该看看promise。
这是一个很棒的...github.com/kriskowal/q
什么是data.results？你能复制/粘贴一个例子吗？我假设它可能是一个数组，而您没有访问第一项。 [0]

标签： javascript jquery api

【解决方案1】：

设法修复它！只需要对最后 3 行进行以下更改 -

var info = data;
var infoHtml = reedsearchTemplate(info);
$("#results").append(infoHtml);

进行了很多测试，但很高兴我找到了它的底部:)

【讨论】：