Извлечь данные из вложенного 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> 

Я хочу для получения динамического идентификатора с помощью кнопки выбранного курса вместо статического, как указано выше, на data.course [] .lectures

JSON:

Так как я могу это сделать? Демо: www.faizansaiyed.ml/EduvanceApp

Answer 1

я думаю, что вы будете делать что-то вроде этого:

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

и в вашем HTML файле вы будете делать:

первый HTML файл

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

и второй 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>