Question

64

AngularJS ng-repeat with no html element

rated 0 times [ 71] [ 7] / answers: 1 / hits: 72950 / 12 Years ago, fri, october 12, 2012, 12:00:00

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>

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.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

brynnleslis

Add To Favorites

Follow

Total Points: 425

Total Questions: 100

Total Answers: 115

Location: Wallis and Futuna

Member since Tue, Mar 30, 2021

3 Years ago

brynnleslis questions

1 How can I start a video at specific timestamp in React?

Sun, Nov 28, 21, 00:00, 3 Years ago

1 How to debug in VS Code by attaching to Edge browser?

Tue, Jun 29, 21, 00:00, 3 Years ago

1 How to fly to a location in react-leaflet

Fri, Feb 19, 21, 00:00, 3 Years ago

1 How do I access localStorage in store of NuxtJs?

Wed, Jul 8, 20, 00:00, 4 Years ago

1 How to remove angular mat-button-toggle hover effect?

Tue, May 19, 20, 00:00, 4 Years ago

View All

answered 12 Years ago markusdamienn · Accepted Answer

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.

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