угловые 1.2.15 бегущие параллельные петли

Question

угловые 1.2.15 бегущие параллельные петли

0

Мне нужно сделать это:

<tbody>
<tr class="object.sibling[0]">
<tr class="object.sibling[1]">
<tr class="object.sibling[2]">
<tr class="object.sibling[2].child">
<tr class="object.sibling[2].child">
<tr class="object.sibling[3]">
<tr class="object.sibling[4]">

однако я не уверен, как отслеживать две циклы, которые являются братьями и сестрами. Я легко могу это сделать:

<tbody> 

<tr class="object.sibling[0]">

<tr class="object.sibling[1]">

<tr class="object.sibling[2]">

<tr class="object.sibling[3]">

<tr class="object.sibling[4]">

<tr class="object.sibling[2].child">

<tr class="object.sibling[2].child">

но тогда строки не соответствуют порядку.

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

<tbody> 

<tr ng-repeat-start="x in object.sibling">

       <td class="x">

<tr ng-repeat-start="y in x.child">

       <td class="Y">

<tr ng-repeat-end="">

<tr ng-repeat-end="">

Проблема в том, что trs, хотя они могут представлять детей братьев и сестер, должны быть на одном уровне, как если бы это все синглы. Я не могу понять, как это сделать с угловым 1.2.15. Как запустить два цикла, которые отслеживают друг друга, которые не вложены?

user995719 06 июль 2015, в 23:13

Источник

Теги:

javascript

angularjs

1 ответ

Ещё вопросы

Agop · Accepted Answer · 2015-07-06T19-20-00.000Z

Хм, интересный сценарий у вас есть. Это должно работать:

<tr ng-repeat-start="sibling in siblings"></tr>
<tr ng-repeat-end ng-repeat="child in sibling.children"></tr>

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

Вот полный пример:

var app = angular.module('app', []);

app.controller('MainCtrl', function($scope) {
  $scope.siblings = [
    {
      children: [
        {}, {}, {}
      ]
    },
    
    {},
    
    {
      children: [
        {}, {}
      ]
    }
  ];
});

<div ng-app="app">
  <table ng-controller="MainCtrl">
    <tr ng-repeat-start="sibling in siblings">
      <td>Sibling {{$index}}</td>
    </tr>
    <tr ng-repeat-end ng-repeat="child in sibling.children">
      <td>Sibling child {{$index}}</td>
    </tr>
  </table>
</div>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script>

Обратите внимание, что нет дополнительных элементов <tr>.

Большое спасибо @Agop и DanielBeck, это сделало эту работу. Мне кажется, что предполагаемый способ использовать начало и конец в этой ситуации, использование фиктивных tr - плохой взлом. И что касается фильтрации, да, это может быть будущим требованием, но не в рамках этой истории.