diff --git a/components/carousel/carousel.component.ts b/components/carousel/carousel.component.ts index 5bdab0db135..2e658f619ad 100644 --- a/components/carousel/carousel.component.ts +++ b/components/carousel/carousel.component.ts @@ -308,7 +308,7 @@ export class NzCarouselComponent implements AfterContentInit, AfterViewInit, OnD this.nzBeforeChange.emit({ from, to }); this.strategy!.switch(this.activeIndex, index).subscribe(() => { this.scheduleNextTransition(); - this.nzAfterChange.emit(index); + this.nzAfterChange.emit(to); this.isTransiting = false; }); this.markContentActive(to); diff --git a/components/carousel/carousel.spec.ts b/components/carousel/carousel.spec.ts index e92e912a0b9..3b079b67ff8 100644 --- a/components/carousel/carousel.spec.ts +++ b/components/carousel/carousel.spec.ts @@ -17,7 +17,7 @@ describe('carousel', () => { beforeEach(fakeAsync(() => { TestBed.configureTestingModule({ imports: [BidiModule, NzCarouselModule], - declarations: [NzTestCarouselBasicComponent, NzTestCarouselRtlComponent] + declarations: [NzTestCarouselBasicComponent, NzTestCarouselRtlComponent, NzTestCarouselActiveIndexComponent] }); TestBed.compileComponents(); })); @@ -284,6 +284,26 @@ describe('carousel', () => { // already covered in components specs. // describe('opacity strategy', () => {}); }); + + describe('carousel nzAfterChange return value', () => { + let fixture: ComponentFixture; + let testComponent: NzTestCarouselActiveIndexComponent; + + beforeEach(() => { + fixture = TestBed.createComponent(NzTestCarouselActiveIndexComponent); + fixture.detectChanges(); + testComponent = fixture.debugElement.componentInstance; + }); + + it('carousel activeIndex should be equal to nzAfterChange return value', fakeAsync(() => { + fixture.detectChanges(); + [0, 1, 2, 3, 4].forEach(_ => { + testComponent.nzCarouselComponent.next(); + tickMilliseconds(fixture, 700); + expect(testComponent.index).toBe(testComponent.nzCarouselComponent.activeIndex); + }); + })); + }); }); describe('carousel custom strategies', () => { @@ -421,3 +441,22 @@ export class NzTestCarouselRtlComponent { @ViewChild(Dir) dir!: Dir; direction = 'rtl'; } + +@Component({ + template: ` + +
+

{{ index }}

+
+
+ ` +}) +export class NzTestCarouselActiveIndexComponent { + @ViewChild(NzCarouselComponent, { static: true }) nzCarouselComponent!: NzCarouselComponent; + array = [0, 1, 2, 3, 4]; + index = 0; + + afterChange(index: number): void { + this.index = index; + } +}