Swiper carousel is not working in Component of ionic angular project

Swiper carousel is working fine on all pages. But not working in component.

//app.module.ts

import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';

@NgModule({
schemas: [CUSTOM_ELEMENTS_SCHEMA],
})


//app.component.ts
import { register } from 'swiper/element/bundle';
register();


//home.page.html
<swiper-container [slidesPerView]="5" [loop]="true" class="header-categories">
<swiper-slide class="ion-text-center" *ngFor="let category of categories">
<ion-button shape="round" color="light" size="large" (click)="category_products(category.id)">
<ion-icon slot="icon-only" name="{{category.app_image}}"></ion-icon>
</ion-button>
<ion-label class="fs-small">{{category.name}}</ion-label>
</swiper-slide>
</swiper-container>



//home.page.ts
import { IonicSlides } from '@ionic/angular'; //For crousel
import { SwiperOptions } from 'swiper/types';


This code is working on pages. But when I add same html and ts file code in component, then it shows this error.

error NG8001: 'swiper-container' is not a known element


Why it is not recognizing swiper tags in component, any idea?

Continue reading...