Добавьте Componets на несколько страниц.Ошибка |Ионная 4 - PullRequest
0 голосов
/ 31 мая 2019

Я пытаюсь добавить на несколько страниц мои компоненты заголовка (компонент Ionic g).

Мой компонент заголовка имеет 4 файла: html, scss, spec.ts и ts.Когда я добавляю этот компонент минимум на 2 страницы, я получаю эту ошибку:

Error: Type HeaderComponent is part of the declarations of 2 modules: Tab1PageModule and ProductPageModule! Please consider moving HeaderComponent to a higher module that imports Tab1PageModule and ProductPageModule. You can also create a new NgModule that exports and includes HeaderComponent then import that NgModule in Tab1PageModule and ProductPageModule.

Его мой компонент выглядит так:

import { HeaderComponent } from './../../partials/header/header.component';
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { Routes, RouterModule } from '@angular/router';

import { IonicModule } from '@ionic/angular';

import { ProductPage } from './product.page';

const routes: Routes = [
  {
    path: '',
    component: ProductPage
  }
];

@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    IonicModule,
    RouterModule.forChild(routes)
  ],

  entryComponents:[HeaderComponent],
  declarations: [ProductPage,HeaderComponent]
})
export class ProductPageModule {}

Я пытаюсь несколькими способами добавить этот компонент, но я все ещеоставайтесь на той же точке.Когда добавляю NgModule в компонент, я получаю ошибку о директивах (не распознается).Когда добавляете ComoneModule (из Ionic Library), мои компоненты отображаются на всех страницах, но привязка двух способов работает неправильно (не обновляется);

Я буду очень признателен за помощь

РЕДАКТИРОВАТЬ Я пытаюсь создать общую модель (Header.components.module.ts), но когда я использую общий модуль, я получаю сообщение об ошибке:

core.js:15724 ERROR Error: Uncaught (in promise): Error: Template parse errors:
Can't bind to 'ngIf' since it isn't a known property of 'ion-buttons'.
import { HeaderComponent } from './header.component';
import { NgModule,CUSTOM_ELEMENTS_SCHEMA  } from '@angular/core';
import { IonicModule } from '@ionic/angular';
import { RouterModule } from '@angular/router';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
@NgModule({

    imports: [CommonModule,
        FormsModule,
        IonicModule,RouterModule],        
    declarations: [
        HeaderComponent,

   ],
   exports: [
    HeaderComponent
   ],
   schemas: [
    CUSTOM_ELEMENTS_SCHEMA
  ]
})

export class HeaderComponentsModule {}


Ответы [ 2 ]

1 голос
/ 31 мая 2019

При объявлении компонента он должен быть объявлен только в одном модуле . Если вы хотите использовать его повторно, вам следует импортировать указанный модуль в другой модуль .

Вы можете создать общий модуль, который содержит:

imports: [MySharedComponent],
exports: [MySharedComponent]

И в Tab1PageModule, и в ProductPageModule:

imports: [MySharedModule]
0 голосов
/ 31 мая 2019

Самый простой способ решить эту проблему - создать файл module.ts для заголовочного компонента и добавить его в массив импорта.

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { IonicModule } from '@ionic/angular';
import { HeaderComponent } from './header.component';

@NgModule({
  imports: [CommonModule, IonicModule],
  declarations: [HeaderComponent ],
  exports: [HeaderComponent ]
})
export class HeaderComponentModule{}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...