Question

加载页面时出错：

compiler.es5.js:1690 Uncaught Error: Type LoginComponent is part of the declarations of 2 modules: LoginModule and AppModule! Please
考虑将LoginComponent移动到更高的导入模块 LoginModule和AppModule。您还可以创建一个新的NgModule 导出并包含LoginComponent然后导入NgModule LoginModule和AppModule。

在@NgModule我有以下声明：

declarations: [AppComponent, LoginComponent, LanguageComponent]

如何解决这个问题？

在app.module文件的顶部，我有导入：

import { LanguageComponent } from './language/language.component';
import  { LoginComponent } from "./login/login.component";

以下部分：

@NgModule({
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    TranslateModule.forRoot(),
    NgbModule.forRoot(),
    CoreModule,
    SharedModule,
    HomeModule,
    AboutModule,
    LoginModule,
    AppRoutingModule,
    InMemoryWebApiModule,
    LocalStorageModule,
    ReactiveFormsModule,
    ReCaptchaModule,
    TextMaskModule,
    MdButtonModule,
    MdCheckboxModule
  ],

  declarations: [AppComponent, LoginComponent, LanguageComponent],
  providers: [
    AuthenticationService,
    HiderPipe,
    TimerService
  ],
  bootstrap: [AppComponent]
})

Answer 1

如果要将组件用于其他模块，则必须执行以下操作。我们假设Login组件位于 LoginModule 中，为了在模块外部使用此组件声明并导出组件。如果您不导出组件，则无法使用UserModule之外的组件

@NgModule({
  imports:[RouterModule,BrowserModule,FormsModule],
  declarations:[LoginComponent],
  exports: [LoginComponent],
})
export class LoginModule {

 }

然后您无需再次将 LoginComponent 声明到App模块中。只需导入 LoginComponent 所在的LoginModule。

 @NgModule({
      imports:[RouterModule,BrowserModule,FormsModule,LoginModule],
      declarations:[],
      exports: [],
    })
    export class AppModule {

     }

Answer 2

loginModuel的双重导入。
你必须删除导入中的loginModuel：[]

无法在Angular中加载组件？

2 个答案: