angularjs - Nested ng-repeat not working -

i trying loop on li element somehow not showing li elements.

here data looping.

{    "30":{       "data":[          {             "id":1,             "report_name":"jimit advizer report",             "is_generated":0,             "shopify_account_id":30,             "total_sales":null,             "created_at":"2016-01-15 06:11:48",             "updated_at":"2016-01-15 06:11:48",             "shop_title":"jimit's store"          },          {             "id":2,             "report_name":"jimit advizer collection report",             "is_generated":0,             "shopify_account_id":30,             "total_sales":null,             "created_at":"2016-01-15 06:13:32",             "updated_at":"2016-01-15 06:13:32",             "shop_title":"jimit's store"          },          {             "id":3,             "report_name":"matt advizer report",             "is_generated":0,             "shopify_account_id":30,             "total_sales":null,             "created_at":"2016-01-15 12:08:22",             "updated_at":"2016-01-15 12:08:22",             "shop_title":"jimit's store"          }       ]         } } 

controller

vm.reports = reports.data;

html

<ul class="list-group">                     <li class="list-header-item clearfix" ng-repeat="(report_id, reports) in vm.reports track $index">                         <h4>woof product shopify store</h4>                     </li>                     <li class="list-group-item clearfix" ng-repeat="r in reports.data track $index">                         <div class="col-sm-12 col-md-5 p-0">                             <h5>necklace revenue advizer<br/><small>1/15/16 - generating</small></h5>                         </div>                         <div class="col-sm-12 col-md-3 m-t-5">                             $17,357 <br/> <b>total sales</b>                         </div>                         <div class="col-sm-6 col-md-4 text-right m-t-5">                             <button class="btn btn-success waves-effect m-r-5">view</button>                             <button class="btn bgm-amber btn-default waves-effect m-r-5">edit</button>                             <button class="btn btn-danger btn-default waves-effect m-r-5" >delete</button>                         </div>                     </li>                 </ul> 

output:

why not able see other "li"?

ng-repeat instance exits on it's inside closing node.

after has no existence.

this reports

<li class="list-header-item clearfix" ng-repeat="(report_id, reports) in vm.reports track $index">     <h4>woof product shopify store</h4> </li> 

has no effect on

<li class="list-group-item clearfix" ng-repeat="r in reports.data track $index"> 

as 2nd code outside of it's boundary

try

<li class="list-group-item clearfix" ng-repeat="r in vm.reports['30']['data'] track $index"> 

demo