Замена компонента в маршрутизации вкладок Angular Ionic

Question

В шаблоне вкладок generi c ioni c я пытаюсь заменить вкладку 2 на компонент. Я продолжаю получать эту ошибку, несмотря на импортированный компонент PeopleComponent:

Моя ошибка:

ERROR Error: Uncaught (in promise): Error: Component PeopleComponent is not part 
of any NgModule or the module has not been imported into your module.
Error: Component PeopleComponent is not part of any NgModule or the module has 
not been imported into your module.

Компонент People очень прост и не выдает ошибок. Я попытался удалить импорт из одного или другого, но это не сработало. Не знаю, что делать.

Модуль приложения:

...
@NgModule({
  declarations: [
  ...
  PeopleComponent,
]
...

Модуль маршрутизации вкладок:

import { PeopleComponent } from './../path/people/people.component';
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { TabsPage } from './tabs.page';

const routes: Routes = [
 {
    path: 'tabs',
    component: TabsPage,
    children: [
 {
    path: 'tab1',
    loadChildren: () => import('../tab1/tab1.module').then(m => m.Tab1PageModule)
  },
  {
    path: 'tab2',
    component: PeopleComponent
    // loadChildren: () => import('../tab2/tab2.module').then(m => m.Tab2PageModule)
  },
  {
    path: 'tab3',
    loadChildren: () => import('../tab3/tab3.module').then(m => m.Tab3PageModule)
  },
  {
    path: '',
    redirectTo: '/tabs/tab1',
    pathMatch: 'full'
  }
]
},
{
   path: '',
   redirectTo: '/tabs/tab1',
   pathMatch: 'full'
}
];

@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule]
})

класс экспорта TabsPageRoutingModule {}

Модуль вкладок:

import { PeopleComponent } from './../path/people/people.component';
import { IonicModule } from '@ionic/angular';
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';

import { TabsPageRoutingModule } from './tabs-routing.module';

import { TabsPage } from './tabs.page';

@NgModule({
  imports: [
    IonicModule,
    CommonModule,
    FormsModule,
    TabsPageRoutingModule,
  ],
  declarations: [TabsPage]
})
export class TabsPageModule {}

Answer 1

Изменить:

Вместо того, чтобы делать то, что было упомянуто ниже, лучше удалить ненужные модули, которые создает стартовый шаблон ioni c tabs.

Вот коммит Я сделал, что удалил ненужные модули и упростил приложение.

Вы можете сделать то же самое с вашим приложением и упростить его.

Старый ответ

Вам нужно будет добавить PeopleComponent внутри declarations из TabsPageModule, а не AppModule.

Проблема в том, что TabsPageModule не знает о PeopleComponent, потому что у него заявлено в AppModule. Если вы не экспортируете PeopleComponent в AppModule и не импортируете AppModule внутри TabsPageModule, PeopleComponent не будет доступен для использования.

Вместо того, чтобы делать все это, как указано в первой строке, просто удалить PeopleComponent из объявлений AppModule и добавить его в объявления в TabsPageModule.