Skip to content
This repository was archived by the owner on Apr 12, 2024. It is now read-only.

feat(ngRepeat): add $prev and $next properties to ngRepeat #9795

Closed
wants to merge 1 commit into from

Conversation

kwypchlo
Copy link
Contributor

  • Adds 2 new properties to ngRepeat item scopes: $prev and $next
  • Adds tests to corresponding changes
  • Makes simple refactoring on comparison used couple of times for better readability

Closes #9740

- Adds 2 new properties to ngRepeat item scopes: $prev and $next
- Adds tests to corresponding changes
- Makes simple refactoring on comparison used couple of times for better readability

Closes angular#9740
@pkozlowski-opensource
Copy link
Member

@kwypchlo this is a nice patch with all the tests, doc update and all - good job! So on this ground it could be merged but I wonder what is the functional use-case here. I mean, I can see what you are proposing but would like to see how it makes your application code easier in your particular case.

Could you please elaborate on how did you bump into the need for $prev / $next? This would help us justify additional bytes / complexity in ngRepeat. Thnx!

@kwypchlo
Copy link
Contributor Author

@pkozlowski-opensource well my PR is more of a reply to #9740 so maybe @lukehorvat could elaborate an example. I kind of just wanted to contribute something and it looked like a nice feature to help out :)

Theoretically, $prev and $next could be beneficial on cases where you would depend on some comparison between a previous or next value.
Let's say you have a list of meetings ordered up by date and time, listed one below another. However, when the day changes, you have to add horizontal rule and write date on the side. In this case you would find beneficial knowing what the previous value was.

@lukehorvat
Copy link

Nice work @kwypchlo!

@pkozlowski-opensource I think the primary use case for it would be to render "differences" between adjacent items in a collection (which, incidentally, I've had to do in the last three Angular apps that I've built). For example:

screen shot 2014-11-15 at 12 02 35 am

In this example, I reference the previous item in an ngClass expression to draw the up/down arrow, and again in a string interpolation to display the percentage number. Doing collection[$index-1].someProperty more than once is cumbersome; it would be nicer to do $previous.someProperty.

It's definitely not an absolutely necessary feature, because $index already allows you to fetch items from the collection, so I won't shed a tear if it is rejected. But given that the likes of $last and $odd already made the cut, $next and $previous seem like a no-brainer.

@Narretz
Copy link
Contributor

Narretz commented Nov 25, 2014

I recently would have found such a feature quite useful, too, so it's get a +1 from me.

@digitalica
Copy link

I like it! It can be used to create headers as well, see issue #10362 . I was thinking the same, but this looks more mature and better, so i'll start using this!

@awerlang
Copy link

+1

Recently, in order to render a flat list grouped by type, with a header, I resorted to group data first with lodash and then apply 2ng-repeat.

This PR could make this scenario simpler I think.

@petebacondarwin
Copy link
Contributor

I wonder if this could be done nicely using a directive... http://plnkr.co/edit/w4e1KfZwlo1L5LFCSzaM?p=preview

Or even better if we provided an NgRepeatController that had properties to make it easy to set up such helpers. For instance the NgRepeatController could contain the collection that is being iterated over and so on. Then the helper directive would just require that and do less work itself.

@awerlang
Copy link

It is nice as a directive. It can be used to even fake groupings, although there are some gotchas: http://plnkr.co/edit/Z7WQHODEXNzHKymZHOnd?p=preview

@kwypchlo
Copy link
Contributor Author

Well I'm going to close this one since it seems it is not going to be merged anyway.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

ngRepeat: $previous and $next
9 participants