Skip to content

Commit b517bd4

Browse files
authored
fix(module:carousel): fix nzAfterChange callback value not correctly (#7326)
close #7323
1 parent 9b51874 commit b517bd4

2 files changed

Lines changed: 41 additions & 2 deletions

File tree

components/carousel/carousel.component.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -308,7 +308,7 @@ export class NzCarouselComponent implements AfterContentInit, AfterViewInit, OnD
308308
this.nzBeforeChange.emit({ from, to });
309309
this.strategy!.switch(this.activeIndex, index).subscribe(() => {
310310
this.scheduleNextTransition();
311-
this.nzAfterChange.emit(index);
311+
this.nzAfterChange.emit(to);
312312
this.isTransiting = false;
313313
});
314314
this.markContentActive(to);

components/carousel/carousel.spec.ts

Lines changed: 40 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ describe('carousel', () => {
1717
beforeEach(fakeAsync(() => {
1818
TestBed.configureTestingModule({
1919
imports: [BidiModule, NzCarouselModule],
20-
declarations: [NzTestCarouselBasicComponent, NzTestCarouselRtlComponent]
20+
declarations: [NzTestCarouselBasicComponent, NzTestCarouselRtlComponent, NzTestCarouselActiveIndexComponent]
2121
});
2222
TestBed.compileComponents();
2323
}));
@@ -284,6 +284,26 @@ describe('carousel', () => {
284284
// already covered in components specs.
285285
// describe('opacity strategy', () => {});
286286
});
287+
288+
describe('carousel nzAfterChange return value', () => {
289+
let fixture: ComponentFixture<NzTestCarouselActiveIndexComponent>;
290+
let testComponent: NzTestCarouselActiveIndexComponent;
291+
292+
beforeEach(() => {
293+
fixture = TestBed.createComponent(NzTestCarouselActiveIndexComponent);
294+
fixture.detectChanges();
295+
testComponent = fixture.debugElement.componentInstance;
296+
});
297+
298+
it('carousel activeIndex should be equal to nzAfterChange return value', fakeAsync(() => {
299+
fixture.detectChanges();
300+
[0, 1, 2, 3, 4].forEach(_ => {
301+
testComponent.nzCarouselComponent.next();
302+
tickMilliseconds(fixture, 700);
303+
expect(testComponent.index).toBe(testComponent.nzCarouselComponent.activeIndex);
304+
});
305+
}));
306+
});
287307
});
288308

289309
describe('carousel custom strategies', () => {
@@ -421,3 +441,22 @@ export class NzTestCarouselRtlComponent {
421441
@ViewChild(Dir) dir!: Dir;
422442
direction = 'rtl';
423443
}
444+
445+
@Component({
446+
template: `
447+
<nz-carousel (nzAfterChange)="afterChange($event)">
448+
<div nz-carousel-content *ngFor="let index of array">
449+
<h3>{{ index }}</h3>
450+
</div>
451+
</nz-carousel>
452+
`
453+
})
454+
export class NzTestCarouselActiveIndexComponent {
455+
@ViewChild(NzCarouselComponent, { static: true }) nzCarouselComponent!: NzCarouselComponent;
456+
array = [0, 1, 2, 3, 4];
457+
index = 0;
458+
459+
afterChange(index: number): void {
460+
this.index = index;
461+
}
462+
}

0 commit comments

Comments
 (0)