feat(animations): support negative query option values

closes #19259
This commit is contained in:
Matias Niemelä 2017-09-18 14:47:43 -07:00 committed by Victor Berchet
parent b54368bf35
commit 86ffacf7ce
2 changed files with 52 additions and 1 deletions

View File

@ -558,7 +558,8 @@ export class AnimationTimelineContext {
const multi = limit != 1;
let elements = this._driver.query(this.element, selector, multi);
if (limit !== 0) {
elements = elements.slice(0, limit);
elements = limit < 0 ? elements.slice(elements.length + limit, elements.length) :
elements.slice(0, limit);
}
results.push(...elements);
}

View File

@ -1762,6 +1762,56 @@ export function main() {
expect(players[0].element.innerText.trim()).toEqual('a');
expect(players[1].element.innerText.trim()).toEqual('b');
});
it('should support negative limit values by pulling in elements from the end of the query',
() => {
@Component({
selector: 'cmp',
template: `
<div [@myAnimation]="exp">
<div *ngFor="let item of items" class="item">
{{ item }}
</div>
</div>
`,
animations: [
trigger(
'myAnimation',
[
transition(
'* => go',
[
query(
'.item',
[
style({opacity: 0}),
animate('1s', style({opacity: 1})),
],
{limit: -3}),
]),
]),
]
})
class Cmp {
public exp: any;
public items: any[] = [];
}
TestBed.configureTestingModule({declarations: [Cmp]});
const fixture = TestBed.createComponent(Cmp);
const cmp = fixture.componentInstance;
cmp.items = ['a', 'b', 'c', 'd', 'e'];
fixture.detectChanges();
cmp.exp = 'go';
fixture.detectChanges();
const players = getLog() as any[];
expect(players.length).toEqual(3);
expect(players[0].element.innerText.trim()).toEqual('c');
expect(players[1].element.innerText.trim()).toEqual('d');
expect(players[2].element.innerText.trim()).toEqual('e');
});
});
});