AngularJs：jsonの文字列をhtmlのテーブルに変換する

Question

私はangularjsの絶対初心者です。私は過去3日間で手を汚しています。今では、残りのエンドポイントからjsonストリングを表データに変換する必要があります。ここで私が試しているコードです。

$scope.getDataCatalogue = function(){ 

     $http.get('http://api.geosvc.com/rest/US/84606/nearby?apikey=485a35b6b9544134b70af52867292071&d=20&pt=PostalCode&format=json') 
      .success(function(data, status, headers, config){ 
       //do something with your response 
       $scope = data; 
      }) 
      .error(function(error){ 
       console.log("not world"); 
      }); 
    } 

    $scope.getDataCatalogue = function(){ 
    alert('getDataCatalogue'); 
    } 

ここで、jsonをデータからグリッドに変換する方法はありますか。これは問題に近づける正しい方法ですか？

Answer 1

固定構造がデータから出てきた場合は、単にng-repeatを使用してオブジェクト（データ）を反復処理し、事前に作成した表に表示するだけです。 Fiddle

例を以下に示します：

が、これはあなたが$scope変数名の人々に割り当てるあなたのオブジェクトである考えます。あなたのHTMLで

.success(function(data, status) { 
    $scope.people = data; 
}); 

：あなたのコントローラで$scope.people = data;

[ 
    { 
     id: 1, 
     firstName: "Peter", 
     lastName: "Jhons" 
    }, 
    { 
     id: 2, 
     firstName: "David", 
     lastName: "Bowie" 
    } 
] 

<table> 
    <tr> 
     <th>Id</th> 
     <th>First Name</th> 
     <th>Last Name</th> 
    </tr> 
    <tr ng-repeat="person in people"> 
     <td>{{person.id}}</td> 
     <td>{{person.firstName}}</td> 
     <td>{{person.lastName}}</td> 
    </tr> 
</table> 

Answer 2

どちらのビューでそれを自分で行います。

<table> 
    <thead> 
     <tr> 
      <th>header 1</th> 
      <th>header 2</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr ng-repeat="row in data"> 
      <td>{{row.attribute1}}</td> 
      <td>{{row.attribute2}}</td> 
     </tr> 
    </tbody> 
</table> 

以上の高度なテーブルをレンダリングするために、UIグリッドのようなライブラリを使用します。