Angular: Nested repeaters

http://angularjs.org/

HTML

<div ng-controller="AppCtrl">
    <li ng-repeat="section in sections">           
            {{section.title}}<br/>
       <span ng-repeat="chapters in section.chapters">          
               &nbsp;&nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp;{{chapters.title}}<br/>        
                  <span ng-repeat="subchapter in chapters.subchapters">            
                     &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;{{subchapter.title}}<br/>
                     <span ng-if="subchapter.pages.length != 0" ng-repeat="page in subchapter.pages">
                       &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;{{page.title}}<br/>
                     </span>
                  </span>  
                  <span ng-if="chapters.pages.length != 0" ng-repeat="page in chapters.pages">            
                     &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;{{page.title}}<br/>
                  </span> 
      </span>         
  </li>   
</div>

JavaScript

var app = angular.module('app', []);
function AppCtrl($scope) {
var sections = [
{
    'secId': 1,
    'title':'sec1',
        'chapters': [
            {
            		'chapId': 1,
                'title':'chap1',
                'subchapters':[
                	{
                  	'subchapId': 1,
                    'title':'subchap 1',  
                    'pages':[
                    {
                       'pageId': 1,
                       'title':'page 1',
                    }
                    ]
                  },
                  {
                    'subchapId': 2,
                    'title':'subchap 2',
                  },
                ]
            },
            {
            		'chapId': 2,
                'title':'chap2',
                 'pages':[
                	{
                  	'pageId': 1,
                    'title':'page 1',
                  }
                ]
            }            
    		]
}, 
{
    'secId': 2,
    'title':'sec2',
        'chapters': [
            {'chapId': 3,'title':'chap3'}, 
            {'chapId': 4,'title':'chap4'}             
    		]
}
    ];

$scope.sections = sections;
}