Используя ng-repeat внутри другого ng-repeat

Я разрабатываю страницу, на которой мне нужно показать несколько полей (используя ng-repeat), которые содержат информацию о каналах и о том, где они будут отображаться (которые являются городами).

Проблема, с которой я сталкиваюсь, это когда я повторяю второй ng-repeat:

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

Это должно получить $ index первого ng-repeat и создать новый массив с местами, где будут показаны каналы. И это именно так. Но когда я применяю второй ng-repeat, используя этот массив, он не работает должным образом.

Сказал, что мой HTML выглядит так (PS: мне нужно использовать значение индекса вместо objCh.name потому что я objCh.name эти поля в столбцы)

<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>

Файл JS выглядит так:

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;
    });
});

И файл json (который создает php) выглядит так:

{
    "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"
        }]
    }]
}

Когда я пытаюсь это работает:

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

Но я не могу сделать это таким образом, потому что узлы json будут динамическими.

Заранее спасибо!

Ответы

Ответ 1

ng-repeat создайте свою собственную $scope.

Итак, для внутренних ng-повторов у вас есть доступ к $parent.$index, где $parent - родительская область текущего блока повторений.

Например:

<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

(упрощено из этого ответа, передавая 2 $ значения индекса во вложенном ng-repeat)