title: error in name for ng-repeat dynamic name how to make it dynamic
body: <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>  &lt;script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"&gt;&lt;/script&gt;
  
          &lt;script&gt;
          
  var app = angular.module('year', []);
  app.controller('customersCtrl', function($scope, $http) {
    
      $http.get("year.php")
     .then(function (response) {
      $scope.years = response.data.years;
     
     var ids = [];
     var havedata = [];
     
    for ( var i = 0 ; i &lt; $scope.years.length; i++) { 
      
    ids.push($scope.years[i]["id"]);
      
      $http.get("book.php?id="+$scope.years[i]["id"]+"").then(function (response) {
    
              books = response.data.yearbooks ;
          
          
                if (response.data.yearbooks.length == 0 )
                {
                  var check = 0 ;
                      for(var t = 0 ; t &lt; ids.length ; t++)
                      {
                          for(var n = 0 ; n &lt; havedata.length ; n++)
                          {
                           
                          if(ids[t] == havedata[n])
                          {
                              check = 1 ;
                          
                              break;
                          }
                          else
                          {
                              check = 0 ;
                              
                          }   
                          }
                          if (check == 0)
                          {
                              
            $scope["yearbook"+ids[t]]  = response.data.yearbooks ;
                             
                          }
                      }           
                }
                else
                {
                  
            $scope["yearbook"+books[0]["year"]]  = response.data.yearbooks ;
           console.log(books[0]["year"]);
              havedata.push(books[0]["year"]);
   
                }
     });
  }
             console.log($scope);
    
   
     });
  });
  
  &lt;/script&gt;
  
  
          
          
         </code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>  
       &lt;div class="panel-group" id="accordion2" role="tablist" aria-multiselectable="true" 
                       ng-app="year" ng-controller="customersCtrl"&gt;
    &lt;div class="panel panel-default" ng-repeat="y in years" &gt;
      &lt;div class="panel-heading" role="tab" id="headingTwo"  &gt;
        &lt;h4 class="panel-title"&gt;
          &lt;a role="button" data-toggle="collapse" data-parent="#accordion2" href="#collapse11{{ y.id }}" aria-expanded="true" aria-controls="collapse11"&gt;
         {{ y.Name }}
          &lt;/a&gt;
        &lt;/h4&gt;
      &lt;/div&gt;
      &lt;div id="collapse11{{ y.id }}"  class="panel-collapse collapse in" role="tabpanel" aria-labelledby="heading22"&gt;
      
        &lt;div class="panel-body"  &gt;
      
        &lt;ul &gt;
        
        &lt;li ng-repeat="x in yearbook"&gt;
       {{ x.Name }}
        &lt;/li&gt;
        
        &lt;/ul&gt;
  
    
  
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
     
     
  &lt;/div&gt;
  
   </code></pre>
  </div>
  </div>
  </p>
  
  <p>**How make my yearbook in <code>&lt;li ng-repeat="x in yearbook"&gt;</code> dynamic to get values  **</p>
  
  <blockquote>
    <p>I think the error in this point but i don't know how to solve it</p>
  </blockquote>
  
  <pre><code> &lt;li ng-repeat="x in yearbook"&gt;
  </code></pre>
  
  <p>[this is the success output when i change yearbook to yearbook3]</p>
  
  <p><a href="http://i.stack.imgur.com/EPKEA.png" rel="nofollow">when i change yearbook to yearbook3</a></p>
  
  <p><strong>what i must do please help me</strong></p>