[ Ionic ] NullInjectorError: No provider for NavParams!

ERROR Error: Uncaught (in promise): NullInjectorError: StaticInjectorError(AppModule)[InviteModalPage -> NavParams]: 
  StaticInjectorError(Platform: core)[InviteModalPage -> NavParams]: 
    NullInjectorError: No provider for NavParams!
NullInjectorError: StaticInjectorError(AppModule)[InviteModalPage -> NavParams]: 
  StaticInjectorError(Platform: core)[InviteModalPage -> NavParams]: 
    NullInjectorError: No provider for NavParams!
    at NullInjector.get (core.js:855)
    at resolveToken (core.js:17514)
    at tryResolveToken (core.js:17440)
    at StaticInjector.get (core.js:17266)
    at resolveToken (core.js:17514)
    at tryResolveToken (core.js:17440)
    at StaticInjector.get (core.js:17266)
    at resolveNgModuleDep (core.js:30393)
    at NgModuleRef_.get (core.js:31578)
    at resolveNgModuleDep (core.js:30393)
    at resolvePromise (zone-evergreen.js:797)
    at resolvePromise (zone-evergreen.js:754)
    at zone-evergreen.js:858
    at ZoneDelegate.invokeTask (zone-evergreen.js:391)
    at Object.onInvokeTask (core.js:39680)
    at ZoneDelegate.invokeTask (zone-evergreen.js:390)
    at Zone.runTask (zone-evergreen.js:168)
    at drainMicroTaskQueue (zone-evergreen.js:559)
    at invokeTask (zone-evergreen.js:469)
    at ZoneTask.invoke (zone-evergreen.js:454)

 

modal page 를 추가하던 도중 위와 같은 에러가 발생했었다. 

한창 삽질 도중 해결이 되었는데  이유는 아래 사진에서 디렉토리 구조에서 invite-modal에 대한 routing을 groups-detail-routing.module.ts에 작성했었는데 Module imports 순서에서 page를 먼저 불러오기 때문에 NullInjectorError 가 발생했던 것이다.

 

@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    ReactiveFormsModule,
    IonicModule,
    InviteModalPageModule,
    GroupsDetailPageRoutingModule,
  ],
  declarations: [GroupsDetailPage],
})

수정 후 --------------------------------------

@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    ReactiveFormsModule,
    IonicModule,
    GroupsDetailPageRoutingModule,
    InviteModalPageModule,
  ],
  declarations: [GroupsDetailPage],
})