JSON解析和使用Angular JS在不同表格中顯示

我是Angular JS的新手。任何一個可以請幫助我如何使用角度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" } ]JSON解析和使用Angular JS在不同表格中顯示

我想與切換到HTML表中buttion顯示在不同的表中的每個JSON對象在不同的表解析和顯示JSON數據。

以上是JSON數據可用...

在此先感謝。

的代碼骨架可在這裏https://github.com/50Cubes/WebappTest

來源

2014-06-23 Lokesh Kurumala

這是index.html文件的代碼 -

<!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文件的代碼。這裏我假設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;}); 
}

來源

2014-06-23 07:02:42 Manvi

JSON解析和使用Angular JS在不同表格中顯示

回答

相關問題