Угловатый.js ng-повторить через несколько элементов

Question

Угловатый.js ng-повторить через несколько элементов

этот вопрос был частично рассмотрен здесь: угловой.js ng-повторить через несколько тр

однако это всего лишь обходной путь, на самом деле он не решает основную проблему, а именно: как можно использовать ng-repeat для нескольких элементов без оболочки?

например, jquery.аккордеон требует, чтобы вы повторили элемент h3 и div, как это можно сделать с помощью ng-repeat?

547 3

jQuery javascript angularjs angularjs-ng-repeat

3 ответов:

Comments

Ничего не найдено.

Igor Minar · Accepted Answer · 2015-08-16 20:18:13

теперь у нас есть надлежащая поддержка для этого, пожалуйста, смотрите:

AngularJs Commmit

С этим изменением теперь вы можете сделать:
<table>
  <tr ng-repeat-start="item in list">
      <td>I get repeated</td>
  </tr>
  <tr ng-repeat-end>
      <td>I also get repeated</td>
  </tr>
</table>

hackfan · Accepted Answer · 2014-05-16 18:35:28

чтобы ответить на вопрос Андре выше на более чем 2 уровнях ng-repeat в таблице, вы можете использовать несколько ng-repeat-start для достижения этой цели.
<tr ng-repeat-start="items in list">
   <td>{{items.title}}</td>
</tr>
<tr ng-repeat-start="item in items">
   <td>{{item.subtitle}}</td>
</tr>
<tr ng-repeat-end ng-repeat="value in item.values">
   <td>{{value.col1}}</td>
   <td>{{value.col2}}</td>
</tr>
<tr ng-repeat-end></tr>
здесь plunker пример

vittore · Accepted Answer · 2017-02-16 17:04:52

обновление: этот ответ устарел. Пожалуйста, смотрите @IgorMinar ответ и использовать стандартный ng-repeat-start и ng-repeat-end директивы.

~~есть два варианта:~~

первый вариант-создать директиву, которая будет отображать несколько тегов и заменять исходный тег (jsfiddle)
<div multi ></div>

angular.module('components').directive('multi', function ($compile) {
return {
    restrict: 'A',
    scope : {
       first : '=',
       last : '=',
    },        
    terminal:true,

    link: function (scope, element, attrs) {
       var tmpl = '', arr = [0,1,2,3]

       // this is instead of your repeater
       for (var i in arr) {
          tmpl +='<div>another div</div>'
       }

       var newElement = angular.element(tmpl);
       $compile(newElement)(scope);
       element.replaceWith(newElement); 
    }
})
второй вариант - использовать обновленный исходный код angular, который включает директиву ngrepeat стиля комментариев (plnkr)
<body ng-controller="MainCtrl">
 <div ng-init="arr=[0,1,2]" ></div>
   
     <div>{{i}}</div>
     <div>{{ 'foo' }}</div>  
   

   {{ arr }}

  <div ng-click="arr.push(arr.length)">add</div>
</body>