使用Angular呈现JSON

有人可以请解释并展示，我如何使用Angular呈现复杂的JSON对象。使用Angular呈现JSON

我打电话给FourSquare API，它根据我的搜索（位置）返回推荐场地列表。 JSON文件非常庞大，我发现很难渲染出相关的数据。

这里是我的JSON的样子： https://developer.foursquare.com/docs/explore#req=venues/explore%3Fnear%3DEarlsfield

这里，这使得到的URL电话在我的控制器的功能。注意;的BaseURL =我建立了我的ACCESSID URL和秘密

//Get response from server 
function fetch(){ 
    $http.get(baseurl + $scope.search) 
    .success(function(response){ 
    console.log(response.response.groups[0].items); 
    $scope.details = response; 

    });

然后我想能够呈现出我的结果与LIS的UL认证。每个李会有会场的名字以及其他信息。目前，我有以下几点：

 <div ng-if="!details"> 
      Loading... 
     </div> 

     <div ng-if="details.Response==='True'"> 
      <ul ng-repeat='groups in response'> 
       <li>{{item.name}}</li> 
       <li>{{item.address}}</li> 

      </ul> 
     </div> 

     <div ng-if="details.Response==='False'"> 
      No results found. 
     </div>

CODEPEN LINK： http://codepen.io/AntonioVassilev/full/EVrKxp/

我在角新手和我发现它通过这样一个大的数据对象混淆浏览。帮助赞赏

来源

2015-11-15 Antonio Vasilev

的details是一个对象，你可以不上了环。取groups第一：像details.groups

JSON结构：http://screencloud.net/v/Oqd

一些示例：

<ul ng-repeat='group in details.groups'> 

      <li>{{group.name}}</li> 
      <li>{{group.type}}</li> 

      <ul ng-repeat='item in group.items'> 

      <pre>{{item}}</pre> 

     </ul>

Some demo you can play with

来源

2015-11-15 20:27:53

不幸的是我仍然不能够访问的名称或类型 - 我做了一个笔（添加到上面的问题）。这应该给更多conext –

@AntonioVasilev我运行相同的URL并获取数据。检查你的代码有什么问题 –

@AntonioVasilev你的固定Codepan：http://codepen.io/anon/pen/KdJzzX?editors=101 –

-1

您应该重复您的范围变量（scope.details）。根据你的js正确的NG-重复似乎是某事像这样：

<div ng-repeat='groups in details'> 
    <div ng-repeat='group in groups'> 
    <ul ng-repeat='item in group.items'> 
     <li>{{item.name}}</li> 
     <li>{{item.address}}</li> 
    </ul> 
    </div> 
</div>

来源

2015-11-15 20:12:24 mentat

使用Angular呈现JSON

回答

相关问题