I created a custom component that has a .ts look like below:

@Component({
  selector: 'app-top-recommendations',
  templateUrl: './top-recommendationsponent.html',
  styleUrls: ['./top-recommendationsponent.scss'],
    imports: [
        CommonModule,
        IonicModule,
        FormsModule
      ],
})
export class TopRecommendationsComponent  implements OnInit {
...

it is embedded on tab1.html like this

        <app-top-recommendations [doRefresh]="doRefreshMainInsights"></app-top-recommendations>

the tab1.ts is like below

@Component({
  selector: 'app-tab1',
  templateUrl: 'tab1.page.html',
  styleUrls: ['tab1.page.scss'],
  standalone: false,
})
export class Tab1Page implements OnInit{
...

I do not see any error when I build but the content of top-recommendations component does not show up either.

i am using ionic 8 with angular.

I created a custom component that has a .ts look like below:

@Component({
  selector: 'app-top-recommendations',
  templateUrl: './top-recommendationsponent.html',
  styleUrls: ['./top-recommendationsponent.scss'],
    imports: [
        CommonModule,
        IonicModule,
        FormsModule
      ],
})
export class TopRecommendationsComponent  implements OnInit {
...

it is embedded on tab1.html like this

        <app-top-recommendations [doRefresh]="doRefreshMainInsights"></app-top-recommendations>

the tab1.ts is like below

@Component({
  selector: 'app-tab1',
  templateUrl: 'tab1.page.html',
  styleUrls: ['tab1.page.scss'],
  standalone: false,
})
export class Tab1Page implements OnInit{
...

I do not see any error when I build but the content of top-recommendations component does not show up either.

i am using ionic 8 with angular.

• angular
• ionic-framework

Share Improve this question Follow asked Mar 11 at 19:59 Moblize ITMoblize IT 1,27044 gold badges2121 silver badges5151 bronze badges 1

• You need to import TopRecommendationsComponent as well where Tab1Page was imported in specific module – Aman Gojariya Commented Mar 12 at 8:14

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 0

I think the problem is when importing the TopRecommendationsComponent component, which is not being imported in Tab1Page, and another problem you could have is explicitly declaring standalone as false in the Tab1Page.