组件是2个模块的声明的一部分：AppModule

Question

我正在尝试通过以下链接构建Basic Ionic SideMenu https://ionicacademy.com/ionic-side-menu-tab-bars/，当我尝试构建时，出现类似的异常错误：未捕获（承诺）：错误：类型DashboardTabsPage是以下两个模块的声明的一部分：AppModule和DashboardTabsPageModule！请考虑将DashboardTabsPage移至导入AppModule和DashboardTabsPageModule的更高模块

app.module.ts：

import { MyApp } from './app.component';
import { HomePage } from '../pages/home/home';
import { DashboardTabsPage } from '../pages/dashboard-tabs/dashboard-tabs';
import { ListsTabsPage } from '../pages/lists-tabs/lists-tabs';
import { NoTabsPage } from '../pages/no-tabs/no-tabs';

@NgModule({
  declarations: [
    MyApp,
    HomePage,
    DashboardTabsPage,
    ListsTabsPage,
    NoTabsPage
  ],
  imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp)
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    HomePage,
    DashboardTabsPage,
    ListsTabsPage,
    NoTabsPage
  ],
  providers: [
    StatusBar,
    SplashScreen,
    {provide: ErrorHandler, useClass: IonicErrorHandler}
  ]
})
export class AppModule {}

app.component.ts：

export class MyApp {
  rootPage:any = HomePage;

  constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen) {
    platform.ready().then(() => {
      // Okay, so the platform is ready and our plugins are available.
      // Here you can do any higher level native things you might need.
      statusBar.styleDefault();
      splashScreen.hide();
    });
  }
}

Home.ts：

import { DashboardTabsPage } from '../dashboard-tabs/dashboard-tabs';
import { ListsTabsPage } from '../lists-tabs/lists-tabs';
import { NoTabsPage } from '../no-tabs/no-tabs';

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

  @ViewChild(Nav) nav: Nav;
  pages: Array<{title: string, component: any}>;
  rootPage = 'DashboardTabsPage';

  constructor(public navCtrl: NavController) {
    this.pages = [
      { title: 'Dashboard', component: DashboardTabsPage },
      { title: 'My Lists', component: ListsTabsPage },
      { title: 'Direkt Profile Link', component: DashboardTabsPage},
      { title: 'No Tabs Link', component: NoTabsPage },
    ];
  }

  openPage(page) {
    this.nav.setRoot(page.component, { openTab: page.openTab });
  }

}

home.ts：

<ion-menu [content]="content">
  <ion-header>
    <ion-toolbar>
      <ion-title>Menu</ion-title>
    </ion-toolbar>
  </ion-header>

  <ion-content>
    <ion-list>
      <button menuClose ion-item *ngFor="let p of pages" (click)="openPage(p)">
        {{p.title}}
      </button>
    </ion-list>
  </ion-content>

</ion-menu>
<ion-nav [root]="rootPage" #content swipeBackEnabled="false"></ion-nav>

Answer 1

由于错误提示 "Type DashboardTabsPage is part of the declarations of 2 modules: AppModule and DashboardTabsPageModule!" ，您需要在 DashboardTabsPage 中导出组件 DashboardTabsPageModule 并在导入的app.module.ts下导入 DashboardTabsPageModule 。

由于您没有 DashboardTabsPage 模块，因此只需将它们从app.module.ts

中删除

@NgModule({
  declarations: [
    MyApp,
    HomePage,
    // DashboardTabsPage,
    // ListsTabsPage,
    // NoTabsPage
  ],
  imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp)
  ]

Answer 2

如错误所述，您不能将这样的实体包含在多个模块中。正确的方法是将其导入到DashboardTabsPageModule并将此模块导入到AppModule。不要同时将它们包括在内。

Answer 3

简便方法

**
import { NoTabsPage } from '../pages/no-tabs/no-tabs';

@NgModule({
  declarations: [
    MyApp,
    HomePage,
    // DashboardTabsPage,
    // ListsTabsPage,
    // NoTabsPage
  ],
  imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp)
  ],
**

注释生成的离子页面声明

Answer 4

从app.module.ts中删除DashboardTabsPage的导入。因为它已经被导入了home.ts

Answer 5

我有2页：

1. 聊天页面
2. ChatGroupPage

我删除了chatGroupPage.ts的模块，并在chatModule.ts的声明中包括了ChatGroupPage：

@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    IonicModule,
    RouterModule.forChild(routes)
  ],
  declarations: [ChatPage, ChatGroupPage],
  entryComponents:[ChatGroupPage]
})

正在工作：-）