2017-07-21 45 views
0

我有一个查询instagram API的API。我试图使用我的API并在表格中显示标签搜索。 JSON的反应是这样的:在表中显示Json数组Javascript

{"data":[{"media_count":13485788,"name":"argentina"},{"media_count":47097,"name":"argentinas"}]} 

,这是我的javascript代码: 型号:

define([], function(){ 
    return { 
    InstagramTag: "", 
    exists: true, 
    tags: [] 
    } ; 

}); 

控制器:

define(["jquery", "events", "model"], function($, events, model) { 

    function initialize() { 
    $("#user-selection").change(function() { 
     var TagName = $("#user-selection").val() ; 
     console.log("Fetching information for " + TagName) ; 
     $("*").css({"cursor": "wait"}) ; 
     $.getJSON("/api/tag/" + TagName, function(data) { 
     model.exists = true ; 
     model.tags = data ; 
     }).fail(function() { 
     model.exists = false ; 
     model.tags = [] ; 
     }).always(function() { 
     model.InstagramTag = TagName ; 
     $("*").css({"cursor": "initial"}) ; 
     events.trigger("model_updated") ; 
     }); 
    }) ; 
    } 

    return { "initialize": initialize }; 

}); 

TagTable:

define(["underscore"], function(_) { 

    var rowTemplate = _.template("<tr>" + 

    "<td><%= name %></td>" + 
    "<td><%= media_count %></td>" 

    "</tr>") ; 

    var repoTable = _.template("<table id='repo-table' class='table'>" + 
    "<thead>" + 
     "<tr>" + 
     "<th>name</th><th>media_count</th>" + 
     "</tr>" + 
    "</thead>" + 
    "<tbody>" + 
     "<%= tbody %>" + 
    "</tbody>" + 
    "</table>") ; 

    function build(model, divName) { 
    var tbody = "" ; 
    _.each(model.tags, function(tag) { 
     tbody += rowTemplate(tag) ; 
    }) ; 
    var table = repoTable({tbody: tbody}) ; 
    $(divName).html(table) ; 
    } 

    return { "build": build } ; 
}) ; 

我得到和犯错或者在TagTable中,我不能在表中显示Json数组。 错误: _each(model.tags,function(tag) - media_count is not defined。 当客人阅读de Json Array时,有些事情是错误的,但我不知道如何解决这个问题。

回答

0

在我看来,你期望model.tags是一个数组,但你得到的JSON是有有值的数组data场中的目标和你的整个对象分配model.tags而不是场。要获得model.tags为数组,您应该指定data字段。因此您应该这样做:

$.getJSON("/api/tag/" + TagName, function(data) { 
    model.exists = true ; 
    model.tags = data.data; // Change this line! 
})... 
+0

谢谢,现在表格显示的是数据 –