角上的子數據具有陣列

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>