utilizzando ng-repeat all'interno di un'altra ripetizione ng

Question

Sto sviluppando una pagina in cui ho bisogno di mostrare alcune caselle (usando ng-repeat) che contiene informazioni sui canali e dove verrà mostrato (quali città).

Il problema che sto affrontando è quando ripeto il secondo ng-repeat:

<table class="table table-condensed" ng-init="nitsCh = [objsCh[$index].nit]"> 

Questo dovrebbe ottenere l'indice $ del primo ng-repeat e creare un nuovo array con i luoghi verranno visualizzati i canali . E fa esattamente questo. Ma quando applico il secondo ng-repeat usando questo array, non funziona correttamente.

Detto questo, il mio html assomiglia a questo: (ps .: Ho bisogno di utilizzare il valore dell'indice INVECE objCh.name perché ho posto queste caselle in colonne)

<div class="box box-solid box-default" ng-repeat="(indexO, objCh) in objsCh track by indexO" ng-if="indexO%4==0 && indexO<=10"> 
     <div class="box-header"> 
     <div class="pull-left"> 
      <img src="dist/img/channels/{{ objsCh[indexO].pic }}" data-toggle="tooltip" title="" data-original-title="Alterar logo do canal"> 
      <h3 class="box-title">{{ objsCh[(indexO)].name }}</h3> 
     </div> 
     <div class="box-tools pull-right"> 
      <button class="btn btn-box-tool" data-toggle="tooltip" title="" data-original-title="Adicionar ou Remover NIT"><i class="fa fa-plus"></i></button> 
     </div> 
     </div> 
     <div class="box-body"> 
     <table class="table table-condensed" ng-init="nitsCh = [objsCh[indexO].nit]"> 
      <tbody> 
      <tr> 
       <th style="width: 10px">#</th> 
       <th>Nit</th> 
      </tr> 
      <tr ng-repeat="(indexN,nitCh) in nitsCh track by indexN"> 
       <td>{{ objsCh[(indexO + 1)].nit[indexN].num }}</td> 
       <td>{{ objsCh[(indexO + 1)].nit[indexN].name }}</td> 
      </tr> 
      </tbody> 
     </table> 
     </div> 
    </div> 

Il file JS assomiglia a questo:

var app = angular.module('appApp', []); 
app.controller('ctrlApp', function($scope, $http) { 

    var url = "includes/exibChNit.php"; 

    $http.get(url).success(function(response) { 
     all = response; 
     $scope.objsCh = all.channels; 
    }); 
}); 

e il file jSON (che PHP creare) si presenta così:

{ 
    "channels": [{ 
     "id": "1", 
     "sid": "1", 
     "name": "Channel", 
     "pic": "channel.jpg", 
     "crc32": "A1g423423B2", 
     "special": "0", 
     "url": "", 
     "key": "", 
     "type": "", 
     "city": [{ 
      "num": "1", 
      "name": "S�o Paulo" 
     }, { 
      "num": "2", 
      "name": "Rio de Janeiro" 
     }] 
    }, { 
     "id": "2", 
     "sid": "2", 
     "name": "CHannel 1", 
     "pic": "channel.jpg", 
     "crc32": "A1F5534234B2", 
     "special": "0", 
     "url": "", 
     "key": "", 
     "type": "", 
     "city": [{ 
      "num": "1", 
      "name": "S�o Paulo" 
     }, { 
      "num": "2", 
      "name": "Rio de Janeiro" 
     }] 
    }] 
} 

Quando provo questo funziona

<table class="table table-condensed" ng-init="nitsCh = [objsCh[($parent.$index + 1)].nit]"> 

Ma non posso farlo in questo modo perché i nodi JSON saranno dinamici.

Grazie in anticipo!

Con i migliori saluti,

Answer 1

ng-repeat 's creare il proprio $scope.

Quindi, per le ripetizioni interne ng, si ha accesso a $parent.$index, dove $parent è l'ambito genitore del blocco ripetizione corrente.

Per esempio:

<ul ng-repeat="section in sections"> 
    <li > 
     {{section.name}} 
    </li> 
    <ul> 
    <li ng-click="loadFromMenu($parent.$index)" ng-repeat="tutorial in section.tutorials"> 
      {{tutorial.name}} 
    </li> 
    </ul> 
</ul> 

Plunkr http://plnkr.co/edit/hOfAldNevxKzZQlxFfBn?p=preview

(semplificato da questa risposta passing 2 $index values within nested ng-repeat)