BrowserModule已经加载错误

Question

我已将我的应用程序更新到RC6,现在我不断收到此错误:

zone.js:484未处理的Promise拒绝:BrowserModule已被加载.如果您需要从延迟加载的模块访问常用指令,如NgIf和NgFor ...

我正在使用延迟加载,我的应用程序被分解为许多延迟加载的模块.然而在RC5一切正常.

我在RC6的更新日志中找到的唯一变化是:

编译器:为无效的NgModule提供程序抛出描述性错误消息

但由于我没有在RC5中看到任何错误,这可能不适用于此.

我有点想法,所以任何帮助都非常感谢.

Answer 1

我认为您正在使用'NoopAnimationsModule'或'BrowserAnimationsModule',它已经包含'BrowserModule'并且懒洋洋地加载您的模块.所以解决方案是在'app.module.ts'中用'NoopAnimationsModule'或'BrowserAnimationsModule'替换BrowserModule.

import { Router } from '@angular/router';
import { AdminsModule } from './admins/admins.module';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
//import { BrowserModule } from '@angular/platform-browser';
import { NgModule,OnInit } from '@angular/core';
import { AppComponent } from './app.component'; 
@NgModule({
    declarations: [
        AppComponent,
    ],
    imports: [
    //BrowserModule,
    NoopAnimationsModule,
    FormsModule
],
    providers: [],
    bootstrap: [AppComponent]
})
export class AppModule {}

Answer 2

我设法解决了我的问题.我正在使用的其中一个库是导入的BrowserModule.

我会在这里留下问题以防有人遇到同样的问题.

Answer 3

就我而言,我不得不使用材料设计taht每个组件使用BrowserAnimationsModule,我删除了所有提及"BrowserAnimationsModule"我把BrowserAnimationsModule连接主模块.

BrowserAnimationsModule已经加入了BrowserModule,这就是问题所在.

Answer 4

没有一个答案对我有用。

对于仍在寻找答案的人，如果您使用的是SharedModule（和延迟加载），我的答案可能会对您有所帮助。

解决方案：移动下列出口：BrowserModule，BrowserAnimationsModule，HttpModule和HttpClientModule（从SharedModule），以进口的AppModule。

例子：

旧的 shared.module.ts：

@NgModule({
   declarations: [],
   imports: [],
   exports: [
      BrowserModule,
      BrowserAnimationsModule,
      HttpClientModule,
      // ...
   ]
})
export class SharedModule { }

旧 app.module.ts：

@NgModule({
   declarations: [
      AppComponent,
   ],
   imports: [
      SharedModule
   ],
   providers: [],
   exports: [],
   bootstrap: [AppComponent]
})
export class AppModule { }

新的 shared.module.ts：

@NgModule({
   declarations: [],
   imports: [],
   exports: [
      // ...
   ]
})
export class SharedModule { }

新 app.module.ts：

@NgModule({
   declarations: [
      AppComponent,
   ],
   imports: [
      BrowserModule,
      BrowserAnimationsModule,
      HttpClientModule,
      SharedModule
   ],
   providers: [],
   exports: [],
   bootstrap: [AppComponent]
})
export class AppModule { }