无法使用 jQuery 解析来自 REST API 调用的 JSON 提要答案

【问题标题】：Trouble parsing JSON feed from REST API call with jQuery无法使用 jQuery 解析来自 REST API 调用的 JSON 提要
【发布时间】：2014-11-11 20:38:43
【问题描述】：

我有一个 REST API 端点，我正在尝试使用 $.ajax 调用来解析它。我可以从端点 URL 看到 JSON 结构，但无法访问键：值对。如何从“类型”访问“实时”和从“部分”访问“项目”？在这种情况下，没有一个跨域问题会阻碍我。这是我的代码：

<div>
    <p class="type">Type:</p>
    <p class="id">ID</p>
</div>

$(document).ready(function () {
    $.ajax({
        url: "http://myrestapiurl.com/"
    }).then(function (data) {
        $('.type').append(data.type);
        $('.id').append(data.items.id);
    });
});

JSON 响应：

{
status: {
    code: 200
},
entity: {
    sections: [{
        type: "Live",
        items: [{}, {}, {}, {}, {}, {}],
        entityType: "Section"
    }],
    entityType: "Content"
    }
}

【问题讨论】：

标签： jquery ajax json rest

【解决方案1】：

您指定的 json 中没有 data.items.id，但是，您可以像这样首先访问该数据：

     var itemsArray = entity.sections[0].items ;

现在，如果项目中有任何 id 字段（在每个对象中），您可以这样做：

    var itemsArray = entity.sections[0].items[0].id ; // 0 is the first object in the items

【讨论】：

item对象中有id。 JSON结构的分数是：entity: { sections: [{ type: "Live", items: [{ id: 967, uuid: "4567", title: "Title of content",我应该可以通过data.entity.sections.items.id访问id和title对吗？
不，检查我的答案编辑
我尝试添加 .then(function (data) { var itemsArray = entity.sections[0].items[0].id $('.type').append(data.entity.sections[0].items[0].id); $('.id').append(data.items.id); }); 但我仍然没有从 JSON 中获取数据。
你能 console.log 完整的 JSON 吗，我会帮你更好
我找到了一个完全独立的解决方案，效果更好。感谢您的意见！

【解决方案2】：

我必须像这样创建另一个条件：

overlays = function(id){
      var returnEL,
          timeline = data.videoJason.entity.stream.timeline;
          _.each(timeline,function(tEl){
            //console.log('id---'.red,tEl);
            if(tEl.id){
              //console.log("tEl.id = ".red, tEl.id, " id = ".red, id, "cond = ".red, (parseInt(tEl.id,10) === parseInt(id,10)));
              if(parseInt(tEl.id,10) === parseInt(id,10)){
                //console.log("id matched cond".red);
                if(tEl.overlays){
                  _.each(tEl.overlays, function(elObj){
                    console.log("OVERLAYS---".red, tEl.overlays)
                    returnEL = tEl.overlays;
                  });
                }
                //console.log('id---',tEl);
              }
            }else{
              returnEL = undefined;
            }
          });

      return returnEL;
    },

然后，在模板中，使用另一个 each 语句来解析对象数组：

        <dt>Overlay:</dt>
        {{#each overlays}}
        <dl class="list-unstyled">
          <li><strong><i>Type:</i></strong> {{type}}</li>
          <li><strong><i>Title:</i></strong> {{title}}</li>
          <li><strong><i>Section:</i></strong> {{section}}</li>
          <li><strong><i>Entity:</i></strong> {{entityType}}</li>
        {{/each}}

【讨论】：