Ion-popover inline 'is not a known element'

Ionic Framework
1

I am attempting to use an ion-popover inline as the documentation states

here is the code that i have

<ion-content>
..Excluded for simplicity
<ion-popover [isOpen]="isLoading">
        <ng-template>
          <ion-spinner></ion-spinner>
        </ng-template>
      </ion-popover>
    </ion-content>

I have other ionic components on this same view like ion-refresher and ion-list and ion-item. But ion-popover is causing the build to fail

image
image934×201 8.46 KB

I have also used the ion-popover in other places within the app but i am using the controller method. In this case i would like to use it as inline.

2

usually, this happens when there is something wrong in the .module
for example, if you load some custom component before the other modules are loaded.

image
image760×538 47.1 KB

check that the order is similar to my example
CommonModule,
FormsModule,
IonicModule,
etc.

3

this is what my module looks like… but still same issue

import { FormsModule } from '@angular/forms';
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { StoreModule } from '@ngrx/store';
import { reducer } from './state/schedule.reducer';
import { EffectsModule } from '@ngrx/effects';
import { ScheduleEffects } from './state/schedule.effects';
import { DatePipe, CommonModule } from '@angular/common';
import { IonicModule } from '@ionic/angular';
const scheduleRoutes: Routes = [];

@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    IonicModule,
    RouterModule.forChild(scheduleRoutes),
    StoreModule.forFeature('schedule', reducer),
    EffectsModule.forFeature([ScheduleEffects])    
  ],
  providers: [
    DatePipe
  ]
})
export class ScheduleModule {}
4

do this:
create a new page and try to use your ion-popover code there.
If it works on the new page, you can begin to import component by component and module by module: eventually, you will find which is the broken one.