title: Angularjs ng-repeat for each unique ID
body: <p>I am new to AngukarJS and ionic framework, I am trying to create an app with the following tree structure: </p>
  
  <pre><code>Home Tab (list of books) (templates/allbooks.html)
  &gt; unique book (book description and chapters) (templates/book-des.html)
  &gt;&gt; unique chapter (templates/book-chapter.html)
  </code></pre>
  
  <p>here is the content of <code>books.js</code></p>
  
  <pre><code>.factory('Books', function() {
  
    // books data
    var books = [{
      id: 0,
      title: 'Sample Title',
      author: 'Sample Author',
      category: 'Horor, Fiction',
      cover: '/cover.jpeg',
      details: 'some details about the book',
      chapters: [
        {
          id : 1,
          name: 'Chapter 1',
          filename: 'chapter1.html',
        },
        {
          id : 2,
          name: 'Chapter 2',
          filename: 'Chapter2.html',
        }
      ]
    }
    .....
  
  
      return {
       ...
      // get the book ID
      get: function(bookId) {
        for (var i = 0; i &lt; books.length; i++) {
          if (books[i].id === parseInt(bookId)) {
            return books[i];
          }
        }
        return null;
      },
      // get the chapter ID
      getChapter: function(chapterId){
        for(var j = 0; j &lt; books.chapters.length; j++){
          return j;
        }
        return null;
      }
    };
  </code></pre>
  
  <p>with the following <code>controllers.js</code></p>
  
  <pre><code>....
  .controller('BookDesCtrl', function($scope, $stateParams, Books) {
    $scope.book = Books.get($stateParams.bookId);
  })
  .controller('BookChapterCtrl', function($scope, $stateParams, Books) {
    $scope.book = Books.get($stateParams.bookId);
    // this returns error for getting chapter ID
    $scope.chapter = Books.getChapter($stateParams.chapterId);
  })
  .....
  </code></pre>
  
  <p>in the <code>templates/allbooks.html</code> I have the following <code>ng-repeat</code></p>
  
  <pre><code>&lt;div ng-repeat="book in books"&gt;
    &lt;p&gt;{{book.title}}&lt;/p&gt;
    &lt;p&gt;{{book.author}}&lt;/p&gt;
    &lt;p&gt;{{book.category}}&lt;/p&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>which successfully list all the books</p>
  
  <p>in the <code>templates/book-des.html</code> I have the following <code>ng-repeat</code></p>
  
  <pre><code>&lt;div class="book-title"&gt;
     &lt;p&gt;{{book.title}}&lt;/p&gt;
  &lt;/div&gt;
  ....
  &lt;div ng-repeat="chapter in book.chapters"&gt;
        &lt;ion-item href="#/tab/books/chapter/{{book.id}}/{{chapter.id}}"&gt;
          &lt;p&gt;{{chapter.name}}&lt;/p&gt;
        &lt;/ion-item&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>which gets the "current" book title and list all chapters. 
  Everything is good so far</p>
  
  <p>but in the <code>templates/book-chapter.html</code> I want to be able to show contents related to that specific chapter. </p>
  
  <p>I tried using <code>ng-repeat="chapter in book.chapters.id"</code> but it is not working. </p>
  
  <p><strong>Main question is here:</strong> </p>
  
  <p>in <code>templates/book-chapter.html</code> template: </p>
  
  <pre><code>&lt;div ng-repeat="chapter in book.chapters.id"&gt;
        &lt;ion-item class="item item-text-wrap"&gt;
        &lt;p&gt;&lt;div ng-include="'{{chapter.filename}}'"&gt;&lt;/div&gt;&lt;/p&gt;
        &lt;/ion-item&gt;
        &lt;p&gt; chapter ID is {{chapter.id}} &lt;/p&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>How can I use the <code>ng-repeate</code> in that template to to pull out the information related to that unique chapter? </p>