Can't extend CarouselComponent

[VGRAJED]

angular 10. ngx-owl-carousel 4.1.0

There are no errors on the console, but the component does not render.

custom-owl-carousel.module.ts

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { CarouselModule } from 'ngx-owl-carousel-o';
import { CustomOwlCarouselComponent } from './custom-owl-carousel.component';

@NgModule({
  imports: [
    CommonModule,
    CarouselModule,
  ],
  declarations: [
    CustomOwlCarouselComponent,
  ],
  exports: [
    CarouselModule,
    CustomOwlCarouselComponent,
  ],
})
export class CustomOwlCarouselModule {}

custom-owl-carousel.component.ts

import { ChangeDetectionStrategy, Component } from '@angular/core';
import { CarouselComponent } from 'ngx-owl-carousel-o';

@Component({
    selector: 'custom-owl-carousel-o',
    templateUrl: './custom-owl-carousel.component.html',
    changeDetection: ChangeDetectionStrategy.OnPush,
})
export class CustomOwlCarouselComponent extends CarouselComponent {

}

What's the right way to extend the component? The goal is to simply change the template.

[vitalii-andriiovskyi]

Hi, @VGRAJED

To extend CarouselComponent, you need to add constructor() { } and call super() with all arguments the CarouselComponent constructor uses.

[VGRAJED]

Hi @vitalii-andriiovskyi, why is that needed? What if I don't want to override the constructor?

Edit: Also some of the arguments in the CarouselComponent are not exported. For example, can't do import { ResizeService } from 'ngx-owl-carousel-o';