AngularJS NG重复，没有html元素 [英] AngularJS ng-repeat with no html element

问题描述

我目前使用的这块code的渲染列表：

I am currently using this piece of code to render a list:

<ul ng-cloak>
    <div ng-repeat="n in list">
        <li><a href="{{ n[1] }}">{{ n[0] }}</a></li>
        <li class="divider"></i>
    </div>
    <li>Additional item</li> 
</ul>

但是，＆LT; D​​IV＆GT; 元素导致在某些浏览器一些很轻微的渲染缺陷。
我想知道有没有办法做NG重复而不DIV容器中，或者一些替代的方法来达到同样的效果。

However, the <div> element is causing some very minor rendering defects on some browsers. I would like to know is there a way to do the ng-repeat without the div container, or some alternative method to achieve the same effect.

推荐答案

随着安迪·乔斯林说，他们正在研究基于注释NG-重复的但显然有太多的浏览器问题。幸运的是AngularJS 1.2增加了内置支持，无需添加子元素与新指令 NG-重复启动和 NG-重复端。

As Andy Joslin said they were working on comment based ng-repeats but apparently there were too many browser issues. Fortunately AngularJS 1.2 adds built-in support for repeating without adding child elements with the new directives ng-repeat-start and ng-repeat-end.

下面是一个小例子添加引导分页：

Here's a little example for adding Bootstrap pagination:

<ul class="pagination">
  <li>
    <a href="#">&laquo;</a>
  </li>
  <li ng-repeat-start="page in [1,2,3,4,5,6]"><a href="#">{{page}}</a></li>
  <li ng-repeat-end class="divider"></li>
  <li>
    <a href="#">&raquo;</a>
  </li>
</ul>

一个完整的工作的例子可以发现这里。

A full working example can be found here.

约翰·林奎斯特也有这种过度的视频教程在他的出色egghead.io页。

John Lindquist also has a video tutorial of this over at his excellent egghead.io page.

这篇关于AngularJS NG重复，没有html元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！