将Ionic页面添加到另一个Ionic页面-Ionic 4

时间:2018-11-09 15:37:31

标签: angular ionic-framework ionic4

我有一个页面,可以在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页面中获取页面的任何想法

1 个答案:

答案 0 :(得分:0)

您应该为子页面创建一个组件。

@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选择器