角上的子数据具有阵列

Question

{ 
    "adult": false, 
    "backdrop_path": "/oja259HY4XlSTSnBwoErZ8A080x.jpg", 
    "belongs_to_collection": { 
    "id": 529, 
    "name": "Wallace & Gromit Collection", 
    "poster_path": "/993pCCMO9g9RQUtNDxQgE1B330H.jpg", 
    "backdrop_path": "/huyrvVKEKa9czUY89fnvaAVAtkX.jpg" 
    }, 
    "budget": 0, 
    "genres": [ 
    { 
     "id": 12, 
     "name": "Adventure" 
    }, 
    { 
     "id": 16, 
     "name": "Animation" 
    }, 
    { 
     "id": 35, 
     "name": "Comedy" 
    }, 
    { 
     "id": 878, 
     "name": "Science Fiction" 
    }, 
    { 
     "id": 10751, 
     "name": "Family" 
    } 
    ], 
    "homepage": "http://www.wallaceandgromit.com/films/a-grand-day-out", 
    "id": 530, 
    "imdb_id": "tt0104361", 
    "original_language": "en", 
    "original_title": "A Grand Day Out", 
    "overview": "Wallace and Gromit have run out of cheese and this provides an excellent excuse for the animated duo to take their holiday on the moon, where, as everyone knows, there is ample cheese. The moon is inhabited by a mechanical caretaker, who is not too happy about the two visitors from earth that nibble on the moon.", 
    "popularity": 1.468545, 
    "poster_path": "/jgQU84QuFQ4yofDmGYzOsXLEQj9.jpg", 
    "production_companies": [ 
    { 
     "name": "Aardman Animations", 
     "id": 297 
    } 
    ], 
    "production_countries": [ 
    { 
     "iso_3166_1": "GB", 
     "name": "United Kingdom" 
    } 
    ], 
    "release_date": "1990-05-18", 
    "revenue": 0, 
    "runtime": 23, 
    "spoken_languages": [ 
    { 
     "iso_639_1": "en", 
     "name": "English" 
    } 
    ], 
    "status": "Released", 
    "tagline": "Join the ultimate human-canine team as they blast off in a home-made rocket to see if the moon is really made of cheese.", 
    "title": "A Grand Day Out", 
    "video": false, 
    "vote_average": 7.3, 
    "vote_count": 96 
} 

NG重复我需要采用了棱角分明的JS以显示HTML有序列表这个数据，我不知道如何通过genres，production_countries，spoken_languages迭代。请让我知道如何在HTML页面

Answer 1

显示它如果我理解正确：

angular.module('app', []). 
 
controller('ctrl', function($scope) { 
 
    $scope.data = data; 
 
}); 
 

 
var data = { 
 
    "adult": false, 
 
    "backdrop_path": "/oja259HY4XlSTSnBwoErZ8A080x.jpg", 
 
    "belongs_to_collection": { 
 
    "id": 529, 
 
    "name": "Wallace & Gromit Collection", 
 
    "poster_path": "/993pCCMO9g9RQUtNDxQgE1B330H.jpg", 
 
    "backdrop_path": "/huyrvVKEKa9czUY89fnvaAVAtkX.jpg" 
 
    }, 
 
    "budget": 0, 
 
    "genres": [ 
 
    { 
 
     "id": 12, 
 
     "name": "Adventure" 
 
    }, 
 
    { 
 
     "id": 16, 
 
     "name": "Animation" 
 
    }, 
 
    { 
 
     "id": 35, 
 
     "name": "Comedy" 
 
    }, 
 
    { 
 
     "id": 878, 
 
     "name": "Science Fiction" 
 
    }, 
 
    { 
 
     "id": 10751, 
 
     "name": "Family" 
 
    } 
 
    ], 
 
    "homepage": "http://www.wallaceandgromit.com/films/a-grand-day-out", 
 
    "id": 530, 
 
    "imdb_id": "tt0104361", 
 
    "original_language": "en", 
 
    "original_title": "A Grand Day Out", 
 
    "overview": "Wallace and Gromit have run out of cheese and this provides an excellent excuse for the animated duo to take their holiday on the moon, where, as everyone knows, there is ample cheese. The moon is inhabited by a mechanical caretaker, who is not too happy about the two visitors from earth that nibble on the moon.", 
 
    "popularity": 1.468545, 
 
    "poster_path": "/jgQU84QuFQ4yofDmGYzOsXLEQj9.jpg", 
 
    "production_companies": [ 
 
    { 
 
     "name": "Aardman Animations", 
 
     "id": 297 
 
    } 
 
    ], 
 
    "production_countries": [ 
 
    { 
 
     "iso_3166_1": "GB", 
 
     "name": "United Kingdom" 
 
    } 
 
    ], 
 
    "release_date": "1990-05-18", 
 
    "revenue": 0, 
 
    "runtime": 23, 
 
    "spoken_languages": [ 
 
    { 
 
     "iso_639_1": "en", 
 
     "name": "English" 
 
    } 
 
    ], 
 
    "status": "Released", 
 
    "tagline": "Join the ultimate human-canine team as they blast off in a home-made rocket to see if the moon is really made of cheese.", 
 
    "title": "A Grand Day Out", 
 
    "video": false, 
 
    "vote_average": 7.3, 
 
    "vote_count": 96 
 
};

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="app" ng-controller="ctrl"> 
 
    <h3>genres</h3> 
 
    <ul id="genres"> 
 
    <li ng-repeat="g in data.genres"> 
 
     {{g.name}} 
 
    </li> 
 
    </ul> 
 
    <h3>countries</h3> 
 
    <ul id="countries"> 
 
    <li ng-repeat="g in data.production_countries"> 
 
     {{g.name}} 
 
    </li> 
 
    </ul> 
 
    <h3>languages</h3> 
 
    <ul id="languages"> 
 
    <li ng-repeat="g in data.spoken_languages"> 
 
     {{g.name}} 
 
    </li> 
 
    </ul> 
 
</div>

Answer 2

Please see the following example 

//employee.json 
{ 
    "resultTruncated": false, 
    "containsSecureData": false, 
    "entries": [ 
     { 
      "type": "employee", 
      "firstName": "Any", 
      "lastName": "One", 
      "address": [ 
       { 
        "streetOne": "123 Long Street", 
        "streetTwo": "Big Building", 
        "streetThree": "Room 456", 
        "city": "City", 
        "state": "ST", 
        "zip": "12345" 
       } 
      ], 
      "phone": [ 
       { 
        "area": "111", 
        "number": "222-3333", 
        "extn": "444" 
       } 
      ], 
      "email": "any@one.edu" 
     } 
    ] 
} 



<div ng-app> 
    <div ng-controller="EmpListCtrl"> 
     <h1>Employees</h1> 
     <ul> 
      <li ng-repeat="employee in employees"> 
       {{employee.lastName}}, {{employee.firstName}}<br/> 
       <a href="mailto:{{employee.email}}">{{employee.email}}</a> 
       <ul> 
        <li ng-repeat="num in employee.phone"> 
         {{num.area}}-{{num.number}}-{{num.extn}} 
        </li> 
       </ul> 
      </li> 
     </ul> 
    </div> 
</div>