Question

因此，我创建了一个组件 ExampleComponent ，并在app.module中不是的模块中声明了该组件。接下来，我要在app.module中列出的模块中声明组件 ExampleComponent 。我该怎么做呢？如果我只是简单地声明它，则会收到以下错误：组件 ExampleComponent 由多个NgModule声明。

abc.module.ts

import { ExampleComponent} from '../Example/Example.component';
@NgModule({
  declarations: [
    ExampleComponent
  ]
})

app.module.ts

import { NewModule} from '../new/new.component';
@NgModule({
  imports: [
    NewModule
  declarations: [
    
  ]
})

new.module

import { ExampleComponent} from '../Example/Example.component';
    @NgModule({
      declarations: [
        ExampleComponent
      ]
    })

Answer 1

如果组件是在 app.module.ts 文件而不是模块文件中导入的，则会出现此错误。< /p>

案例研究：

我的文件夹结构如下：

app 
   src 
     component 
        general.component.ts 
        general.component.html 
        general.component.scss 
        general.component.spect 
        general.module.ts
        general.model.ts 
        general.services.ts
app.module.ts
app.routing.ts

错误“组件由多个 NgModule 声明” 将在以下情况下发生

在 app.module.ts 文件中，如果您已按如下方式导入；

import { GeneralComponent } from './component/general/graph.component';

@NgModule({
          declarations: [
           GeneralComponent
          ],
    })

解决问题的更改

导出general.module.ts里面的general.component，如下图：

general.module.ts

    import { NgModule } from '@angular/core'
    import { CommonModule } from '@angular/common'
    import { GeneralComponent } from './general.component'    
    @NgModule({
      declarations: [GeneralModule.rootComponent],
      imports: [CommonModule],
      exports: [GeneralModule.rootComponent],
      entryComponents: [GeneralModule.rootComponent],
    })
    export class GeneralModule {
      static rootComponent = GeneralComponent
    }

在 app.module.ts 中导入 general.module.ts

app.module.ts

 import { GeneralModule } from './component/graph-general/graph-general.module';
    @NgModule({
      declarations: [
      ],
      imports: [  
         GeneralModule ,
    ]
    }) 
    export class AppModule { 
}

注意：始终只有组件应该在声明中，所有模块都应该在导入中。

Answer 2

如果在多个模块中使用组件，则表示该组件是共享的。您需要为./Library/PostgreSQL/{postgres_version}/share/postgresql/创建一个专用模块（ExampleModule），然后将该模块导入要使用ExampleComponent的任何位置。

因此创建ExampleModule：

ExampleComponent

然后将其导入到您想使用的import { ExampleComponent} from '../Example/Example.component'; @NgModule({ declarations: [ ExampleComponent, ], exports: [ ExampleComponent, ] }) export class ExampleModule { }（到ExampleComponent和abc module）中，如下所示：

app module

通过为共享组件定义单独的模块，您提供了一个封装层，您可以在其中描述和提供组件工作所需的所有依赖关系，因此，将来，所有使用者都只需导入模块本身无需了解所有有关这些依赖项的任何信息。

该组件由多个NgModule声明

2 个答案: