將Ionic頁面添加到另一個Ionic頁面-Ionic 4

Question

我有一個頁面，可以在Ionic 4應用程序中用作普通頁面，但是我還需要在應用程序中的其他頁面中重用它，以停止重復代碼。

我當前的方法是遵循對普通指令采取的方法，並將選擇器添加到我希望將頁面放入其中的頁面：

<app-child></app-child>

然后將子頁面模塊導入添加到父頁面模塊中：

@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    IonicModule,
    RouterModule.forChild(routes),
    ComponentsModule,
    ChildPageModule,
  ],
  declarations: [ParentPage]
})
export class ParentPageModule {}

但是我然后遇到錯誤：

ChildPage is part of the declarations of 2 modules:

哪個當然有意義，因為它是主頁，現在是組件頁。

我嘗試將導入移動到app模塊中，嘗試將頁面添加到父頁面模塊的聲明中，但是都無法解決問題。

有關如何在Ionic 4 / Angular 6中獲取頁面內頁面的任何想法

Answer 1

您應該為子頁面創建一個組件。

@Component({
  selector: 'app-childpage',
  templateUrl: './childpage.component.html'
})

export class ChildpageComponent {

}

然后創建一個components.module.ts並執行：

@NgModule({
  declarations: [
    ChildpageComponent
  ],
  imports: [
    ...
  ],
  exports: [
    ChildpageComponent
  ]
})
export class ComponentsModule {}

現在，您可以在其他頁面中使用<app-childpage></app-childpage>選擇器，方法是將ComponentsModule導入各自的模塊中