feat(ngRepeat): add $even and $odd props to iterator

This commit is contained in:
P. Envall 2013-07-19 17:02:17 +02:00 committed by Ken Sheedlo
parent 0fcd1e3b1f
commit 52b8211fd0
2 changed files with 65 additions and 1 deletions

View file

@ -17,6 +17,8 @@
* | `$first` | {@type boolean} | true if the repeated element is first in the iterator. |
* | `$middle` | {@type boolean} | true if the repeated element is between the first and last in the iterator. |
* | `$last` | {@type boolean} | true if the repeated element is last in the iterator. |
* | `$even` | {@type boolean} | true if the iterator position `$index` is even (otherwise false). |
* | `$odd` | {@type boolean} | true if the iterator position `$index` is odd (otherwise false). |
*
* Additionally, you can also provide animations via the ngAnimate attribute to animate the **enter**,
* **leave** and **move** effects.
@ -354,6 +356,7 @@ var ngRepeatDirective = ['$parse', '$animator', function($parse, $animator) {
childScope.$first = (index === 0);
childScope.$last = (index === (arrayLength - 1));
childScope.$middle = !(childScope.$first || childScope.$last);
childScope.$odd = !(childScope.$even = index%2==0);
if (!block.startNode) {
linker(childScope, function(clone) {

View file

@ -353,7 +353,6 @@ describe('ngRepeat', function() {
expect(element.text()).toEqual('misko:0|shyam:1|frodo:2|');
});
it('should expose iterator offset as $index when iterating over objects', function() {
element = $compile(
'<ul>' +
@ -395,6 +394,32 @@ describe('ngRepeat', function() {
});
it('should expose iterator position as $even and $odd when iterating over arrays',
function() {
element = $compile(
'<ul>' +
'<li ng-repeat="item in items">{{item}}:{{$even}}-{{$odd}}|</li>' +
'</ul>')(scope);
scope.items = ['misko', 'shyam', 'doug'];
scope.$digest();
expect(element.text()).
toEqual('misko:true-false|shyam:false-true|doug:true-false|');
scope.items.push('frodo');
scope.$digest();
expect(element.text()).
toBe('misko:true-false|' +
'shyam:false-true|' +
'doug:true-false|' +
'frodo:false-true|');
scope.items.shift();
scope.items.pop();
scope.$digest();
expect(element.text()).toBe('shyam:true-false|doug:false-true|');
});
it('should expose iterator position as $first, $middle and $last when iterating over objects',
function() {
element = $compile(
@ -420,6 +445,27 @@ describe('ngRepeat', function() {
});
it('should expose iterator position as $even and $odd when iterating over objects',
function() {
element = $compile(
'<ul>' +
'<li ng-repeat="(key, val) in items">{{key}}:{{val}}:{{$even}}-{{$odd}}|</li>' +
'</ul>')(scope);
scope.items = {'misko':'m', 'shyam':'s', 'doug':'d', 'frodo':'f'};
scope.$digest();
expect(element.text()).
toBe('doug:d:true-false|' +
'frodo:f:false-true|' +
'misko:m:true-false|' +
'shyam:s:false-true|');
delete scope.items.frodo;
delete scope.items.shyam;
scope.$digest();
expect(element.text()).toBe('doug:d:true-false|misko:m:false-true|');
});
it('should calculate $first, $middle and $last when we filter out properties from an obj', function() {
element = $compile(
'<ul>' +
@ -435,6 +481,21 @@ describe('ngRepeat', function() {
});
it('should calculate $even and $odd when we filter out properties from an obj', function() {
element = $compile(
'<ul>' +
'<li ng-repeat="(key, val) in items">{{key}}:{{val}}:{{$even}}-{{$odd}}|</li>' +
'</ul>')(scope);
scope.items = {'misko':'m', 'shyam':'s', 'doug':'d', 'frodo':'f', '$toBeFilteredOut': 'xxxx'};
scope.$digest();
expect(element.text()).
toEqual('doug:d:true-false|' +
'frodo:f:false-true|' +
'misko:m:true-false|' +
'shyam:s:false-true|');
});
it('should ignore $ and $$ properties', function() {
element = $compile('<ul><li ng-repeat="i in items">{{i}}|</li></ul>')(scope);
scope.items = ['a', 'b', 'c'];