Questions tagged [angularjs-ng-repeat]

The `ngRepeat` directive instantiates a template once per item from a collection. Each template instance gets its own scope, where the given loop variable is set to the current collection item, and `$index` is set to the item index or key.

The ngRepeat directive instantiates a template once per item from a collection. Each template instance gets its own scope, where the given loop variable is set to the current collection item, and $index is set to the item index or key.

Special properties are exposed on the local scope of each template instance, including $index, $first, $middle and $last.

Usage

As an attribute

<ANY ng-repeat="{repeat_expression}">
   ...
</ANY>

Directive info

  • This directive creates a new scope.
  • This directive executes at priority level 1000.

Animations

  • enter - when a new item is added to the list or when an item is revealed after a filter
  • leave - when an item is removed from the list or when an item is filtered out
  • move - when an adjacent item is filtered out causing a reorder or when the item contents are reordered

References:

http://docs.angularjs.org/api/ng.directive:ngRepeat

7617 questions
695
votes
9 answers

How to iterate over the keys and values with ng-repeat in AngularJS?

In my controller, I have data like: $scope.object = data Now this data is the dictionary with keys and values from json. I can access the attribute with object.name in the template. Is there any way that I can iterate over the keys as well and…
user192362127
  • 10,605
  • 8
  • 22
  • 21
427
votes
27 answers

Way to ng-repeat defined number of times instead of repeating over array?

Is there a way to ng-repeat a defined number of times instead of always having to iterate over an array? For example, below I want the list item to show up 5 times assuming $scope.number equal to 5 in addition incrementing the number so each list…
Malcr001
  • 7,969
  • 9
  • 41
  • 57
388
votes
8 answers

orderBy multiple fields in Angular

How to sort by using multiple fields at same time in angular? fist by group and then by sub-group for Example $scope.divisions = [{'group':1,'sub':1}, {'group':2,'sub':10}, {'group':1,'sub':2},{'group':1,'sub':20},{'group':2,'sub':1}, …
gmeka
  • 4,239
  • 3
  • 20
  • 25
378
votes
10 answers

AngularJS ng-repeat handle empty list case

I thought this would be a very common thing, but I couldn't find how to handle it in AngularJS. Let's say I have a list of events and want to output them with AngularJS, then that's pretty easy:
324
votes
6 answers

passing 2 $index values within nested ng-repeat

So I have an ng-repeat nested within another ng-repeat in order to build a nav menu. On each
  • on the inner ng-repeat loop I set an ng-click which calls the relevant controller for that menu item by passing in the $index to let the app know which…
  • Tules
    • 4,765
    • 2
    • 25
    • 29
    286
    votes
    4 answers

    How to use ng-repeat for dictionaries in AngularJs?

    I know that we can easily use ng-repeat for json objects or arrays like:
    but how can we use the ng-repeat for dictionaries, for example: var users = null; users["182982"] =…
    Vural
    • 8,391
    • 11
    • 37
    • 54
    253
    votes
    24 answers

    AngularJS For Loop with Numbers & Ranges

    Angular does provide some support for a for loop using numbers within its HTML directives:
    do something
    But if your scope variable includes a range that has a dynamic number then you will need to…
    matsko
    • 20,727
    • 21
    • 94
    • 138
    228
    votes
    17 answers

    angular ng-repeat in reverse

    How can i get a reversed array in angular? i'm trying to use orderBy filter, but it needs a predicate(e.g. 'name') to sort: {{friend.name}} {{friend.phone}} …
    Delremm
    • 3,031
    • 4
    • 16
    • 13
    218
    votes
    6 answers

    Access index of the parent ng-repeat from child ng-repeat

    I want to use the index of the parent list (foos) as an argument to a function call in the child list (foos.bars). I found a post where someone recommends using $parent.$index, but $index is not a property of $parent. How can I access the index of…
    Coder1
    • 12,741
    • 13
    • 52
    • 74
    209
    votes
    15 answers

    ng-repeat finish event

    I want to call some jQuery function targeting div with table. That table is populated with ng-repeat. When I call it on $(document).ready() I have no result. Also $scope.$on('$viewContentLoaded', myFunc); doesn't help. Is there any way to…
    ChruS
    • 3,597
    • 5
    • 27
    • 38
    183
    votes
    10 answers

    Preserve line breaks in angularjs

    I have seen this SO question. My code instead of ng-bind="item.desc" uses {{item.desc}} because I have a ng-repeat before. So my code:
    {{item.description}}
    The item description contains \n for newlines which…
    Diolor
    • 12,142
    • 23
    • 103
    • 165
    181
    votes
    9 answers

    Using comma as list separator with AngularJS

    I need to create a comma-separated list of items:
  • {{email}}{{$last ? '' : ', '}}...
  • According to the AngularJS documentation, no control flow statements is…
    Franck Freiburger
    • 21,662
    • 20
    • 60
    • 90
    165
    votes
    12 answers

    How to improve performance of ngRepeat over a huge dataset (angular.js)?

    I have a huge dataset of several thousand rows with around 10 fields each, about 2MBs of data. I need to display it in the browser. Most straightforward approach (fetch data, put it into $scope, let ng-repeat="" do its job) works fine, but it…
    n1313
    • 18,981
    • 7
    • 27
    • 45
    136
    votes
    20 answers

    How to filter multiple values (OR operation) in angularJS

    I want to use the filter in angular and want to filter for multiple values, if it has either one of the values then it should be displayed. I have for example this structure: An object movie which has the property genres and I want to filter for…
    JustGoscha
    • 23,623
    • 14
    • 46
    • 61
    135
    votes
    2 answers

    AngularJS - How can I reference the property name within an ng-Repeat

    In addition to rendering the value of the properties in an object, I'd also like to render the property name as a label. Is there a way to do this with ng-repeat? For example:
    • {{propertyName}}:…
    Brian Flanagan
    • 4,554
    • 5
    • 26
    • 36
    1
    2 3
    99 100