2014-06-23 2 views
0

여기 Angular JS를 처음 사용했습니다. 어느 한 내가 HTML 테이블을 바꾸는 buttion과 다른 테이블의 각 JSON 개체를 표시 할 각도 JS [ { "id": 0, "isActive": false, "balance": 1025.00, "picture": "http://www.placekitten.com/50/50", "age": 25, "name": "Daisy Mcneil", "gender": "female", "company": "Verbus", "email": "[email protected]", "phone": "+1 (936) 586-3983", "address": "849 Newkirk Placez, Laurelton, Nevada, 1086", "registered": "2012-07-15T13:46:25 +07:00", "friends": [ { "id": 0, "name": "Debra Blair" }, { "id": 1, "name": "Henry Avila" }, { "id": 2, "name": "Jody Stark" } ], "service": "cherry" }, { "id": 1, "isActive": true, "balance": -2884.00, "picture": "http://www.placekitten.com/50/50", "age": 23, "name": "Schroeder Atkinson", "gender": "male", "company": "Twiggery", "email": "[email protected]", "phone": "+1 (861) 449-2254", "address": "259 Highland Avenue, Riner, Vermont, 905", "registered": "1998-01-17T08:16:34 +08:00", "friends": [ { "id": 0, "name": "Mendoza Figueroa" }, { "id": 1, "name": "Lenore Morales" }, { "id": 2, "name": "Winifred Bowen" } ], "service": "lemon" } ]각도 JS를 사용하여 JSON을 구문 분석하고 다른 테이블에 표시

를 사용하여 다른 테이블에있는 JSON 데이터를 분석하고 표시하는 방법 좀 도와주세요 수 있습니다.

위의 JSON 데이터를 사용할 수 있습니다.

감사합니다.

<!doctype html> 
<html> 
<head> 
<title>Page Title</title> 
<script src="main.js"></script> 
</head> 
<body> 
<div ng-app="MyApp"> 
<div ng-controller="ViewJson"> 

<table> 
<th> 
<td>id</td> 
<td>isActive</td> 
<td>balance</td> 
<td>picture</td> 
<td>age</td> 
<td>name</td> 
<td>gender</td> 
<td>company</td>   
<td>email</td>  
<td>phone</td> 
<td>address</td> 
<td>registered</td>  
<td>service</td></th> 
<tr ng-repeat="post in posts">      
<td>{{post.id}}</td>  
<td>{{post.isActive}}</td>  
<td>{{post.balance}}</td>  
<td>{{post.picture}}</td>  
<td>{{post.age}}</td>  
<td>{{post.name}}</td>  
<td>{{post.gender}}</td>   
<td>{{post.company}}</td>  
<td>{{post.email}}</td>  
<td>{{post.phone}}</td>  
<td>{{post.address}}</td>  
<td>{{post.registered}}</td>   
<td>{{post.service}}</td></tr></table> 
</div> 
</div> 
</body> 
</html> 

이 main.js 파일의 코드는 - 코드에 대한

골격이가 된 index.html 파일에 대한 코드 여기 https://github.com/50Cubes/WebappTest

답변

0

사용할 수 있습니다. 여기 json 파일의 이름은 posts.js라고 가정합니다.

var app=angular.module('MyApp',[]); 
function ViewJson($scope, $http) 
{$http({method: 'POST', url: 'js/posts.json'}).success(function(data) 
    {$scope.posts = data;}); 
} 
관련 문제