diff --git a/projects/igniteui-angular/src/lib/carousel/carousel-base.ts b/projects/igniteui-angular/src/lib/carousel/carousel-base.ts
index 994e2e46d0c..d8e4c73fd48 100644
--- a/projects/igniteui-angular/src/lib/carousel/carousel-base.ts
+++ b/projects/igniteui-angular/src/lib/carousel/carousel-base.ts
@@ -52,8 +52,14 @@ export abstract class IgxCarouselComponentBase implements OnDestroy {
     }
 
     public ngOnDestroy(): void {
-        this.enterAnimationPlayer?.destroy();
-        this.leaveAnimationPlayer?.destroy();
+        if (this.enterAnimationPlayer) {
+            this.enterAnimationPlayer.destroy();
+            this.enterAnimationPlayer = null;
+        }
+        if (this.leaveAnimationPlayer) {
+            this.leaveAnimationPlayer.destroy();
+            this.leaveAnimationPlayer = null;
+        }
     }
 
     /** @hidden */
diff --git a/projects/igniteui-angular/src/lib/carousel/carousel.component.spec.ts b/projects/igniteui-angular/src/lib/carousel/carousel.component.spec.ts
index b99e6ec5007..eed91554909 100644
--- a/projects/igniteui-angular/src/lib/carousel/carousel.component.spec.ts
+++ b/projects/igniteui-angular/src/lib/carousel/carousel.component.spec.ts
@@ -745,6 +745,17 @@ describe('Carousel', () => {
             expect(carousel.get(1).nativeElement.classList.contains(HelperTestFunctions.ACTIVE_SLIDE_CLASS)).toBeTruthy();
             expect(carousel.get(0).nativeElement.classList.contains(HelperTestFunctions.PREVIOUS_SLIDE_CLASS)).toBeFalsy();
         });
+
+        it('should not throw an error when playing an animation and destroying the component - #15976', () => {
+            expect(() => {
+                carousel.next();
+                carousel.ngOnDestroy();
+                fixture.detectChanges();
+            }).not.toThrow();
+
+            expect(carousel['enterAnimationPlayer']).toBe(null);
+            expect(carousel['leaveAnimationPlayer']).toBe(null);
+        });
     });
 
     describe('Dynamic Slides: ', () => {