入れ子JSONからデータを取得し、AngularJSを使用してリストを表示

Question

現在、AngularJSとJSONデータを持つアプリケーションで作業していて、ある時点で固まっています。また、私はAngularの初心者です。ここでは、次のとおりです。

コントローラスニペット：

courseController.controller('LectureController', ['$scope', '$http', function($scope, $http){ 

    $http.get('js/data.json').success(function(data){ 

     $scope.lecture = **data.course[4].lectures**; 

     $scope.lectureOrder = 'videoId'; 
    }); 
}]); 

とビューは次のとおりです。（Details.html）

<section class="artistinfo"> 
    <div class="artist cf" ng-model="courses"> 
    <div align="right"><a href="#/details/{{prevItem}}" class="btn btn-left">&lt;</a> 
    <a href="#/details/{{nextItem}}" class="btn btn-left">&gt;</a></div> 
    <img ng-src="{{courses[whichItem].thumbnail}}" alt="Photo of {{courses[whichItem].name}}"> 
    <h1>{{courses[whichItem].name}}</h1> 
    <div class="info"> 
     <h3>{{courses[whichItem].description}}</h3> 

     <div align="right">Lectures: {{courses[whichItem].lectures.length}}</div> 
     <div align="center"> 
     <a href="#/lectures/{{courses[whichItem].courseId}}"> 
      <button>Get Started</button></div> 
     </a> 
    </div> 
    </div> 
    <a href="index.html">&laquo; Back to search</a> 
</section> 

（Lectures.html）

<section class="artistpage"> 
    <ul class="artistlist" ng-app> 
     <li ng-animate="animate'" class="artist cf" ng-repeat="lec in lecture | orderBy: videoId"> 
       <div class="info"> 
        <h2>{{lec.videoName}}</h2> 
        <h3>{{lec.videoDetails | cut:true:160:' ...'}}</h3> 
       </div> 
     </li> 
    </ul> 
</section> 

私が欲しいです上のような静的ではなく、選択したコースのボタンからダイナミックIDを取得することができます。[] .lectures

JSON：

だから私はこれを行うことができますか？ デモ：

$http.get('js/data.json').success(function(data) { 
    $scope.records = data; 
    $scope.whichItem = $routeParams.itemId; 

とあなたのhtmlファイルにあなたがそれを行います：www.faizansaiyed.ml/EduvanceApp

Answer 1

は、私はあなたがそのような何かをすると思います

最初のhtmlファイル

<a href="#details/{{records.indexOf(item)}}" > 

とのために2番目のhtmlファイルは次のようになります： 例えば：

<div class="col s12 error_info_box" ng-repeat="item in records[whichItem].errors"> 

     <p><b>Error Type&#58;</b>&nbsp;&nbsp;{{item.type}}</p> 






     </div>