Angular.js ng-repeat list from *.JSON file

问题:

I begin learning Angular.js and I have first little problem.

This is my hello.js file:

function Hello($scope, $http) {   $http.get('URL').   success(function(data) {   $scope.response = data  });} 

The response is a *.json file that I need to parse. JSON looks in a way:

"data":[{    "status":"true",    "name":"blabla" },{    "status":"true",    "name":"blabla2" }] 

In index.html file I have <div ng-controller="Hello"> where I would like to make a list of all JSON's status and name fields.

I have no idea how could I use ng-repeat in order to make a list of all components from *.json file. Could you help me? :)

Cheers,

Luke

回答1:

If I understood your question properly, and you want to keep your controller as it is, you should do something like:

Html:

<ul>     <li ng-repeat="resp in response.data">          My Status: {{resp.status}} and my Name: {{resp.name}}     </li> </ul> 

Hope I've been helpfull.

回答2:

Example: if you assign the json data to a $scope variable in your Controller, then this is one possible way of using ng-repeat to show it in the View:

HTML:

<div ng-app='App' ng-controller="AppCtrl">   <table>      <tr>          <th ng-repeat="(key, val) in data[0]">{{key}}</th>      </tr>      <tr ng-repeat="stuff in data">          <td ng-repeat="(key, val) in stuff">{{val}}</td>      </tr>   </table> </div> 

JS:

angular.module('App', []) .controller('AppCtrl', function($scope) {      $scope.data = [         {"status":"true",           "name":"blabla"},         {"status":"true",          "name":"blabla2"}     ]; }); 

Output:

name status
blabla true
blabla2 true

EDIT: updated fiddle: http://jsfiddle.net/nndc91cp/2/


or you can create a list this way:
HTML:

<ul>    <li ng-repeat="stuff in data"> {{stuff.status}} : {{stuff.name}}</li> </ul> 

Output:

• true : blabla
• true : blabla2

文章来源: Angular.js ng-repeat list from *.JSON file