无法在两页角离子3之间共享组件

Question

I want to share component between two pages in ionic 3.

I have common component SearchInputComponent added in component folder.

When i try to add, i was getting this error SearchInputComponent is part of the declarations of 2 modules

After searching a bit on net i found a way ie create new sharedModule inside it keep common components.

So created SharedModule.module.ts in component folder.

SharedModule.module.ts

import { NgModule } from '@angular/core';
import { SearchInputComponent } from './search-input/search-input';

@NgModule({
    imports: [
     ],
    declarations: [
        SearchInputComponent
    ],
    exports: [
        SearchInputComponent
    ]
})

export class SharedModule {}

I want to use my SearchInputComponent in myPage1 and myPage2,

so inside

myPage1.module.ts

@NgModule({
  declarations: [
    myPage1
  ],
  imports: [
    IonicPageModule.forChild(myPage1),
    SharedModule
  ],
})
export class myPage1PageModule {}

myPage2.module.ts

@NgModule({
  declarations: [
    myPage2
  ],
  imports: [
    IonicPageModule.forChild(myPage2),
    SharedModule
  ],
})
export class myPage2PageModule {}

but it is not working, showing some weird Error: Template parse errors:....

Can any one help me to find my mistake?

Thank you in advance!

Answer 1

Could you please write all the error log? It seems that you have exported and imported right the module. But maybe there is an error with the template.

For discarding template errors, try to comment all the logic on your 'SearchInputComponent'.

Answer 2

I found the solution, It might help someone

SharedModule.module.ts

I added imports: [IonicPageModule.forChild(SearchInputComponent)], and it got worked.