通知不会在延迟加载的模块中消失。 （像“ng2-toasty”或“angular2-notifications”这样的图书馆）

Question

我正在尝试在我的应用程序（Angular CLI-4.4.6）中使用延迟加载模块中的“ng2-toasty”或“angular2-notifications”等库。所有此类库的文档都表明我需要导入BrowserAnimationModule。但是当我将这个模块（BrowserAnimationModule）导入我的应用程序的根模块时，我遇到了一个问题 - 通知不会消失。

当我在寻找这个问题的解决方案时，我发现有些开发人员有same problem。但他们只是通过导入BrowserAnimationModule来解决它。我无法直接在businessModule中导入BrowserAnimationModule，因为得到一个错误：“BrowserModule已经被加载了。”

我想到我的问题是BrowserAnimationModule在延迟加载的模块中不起作用，我在其中使用通知。但我也找不到解决这个问题的方法。

如果有任何帮助，我将不胜感激。

的AppModule：

@NgModule({
  imports: [
    BrowserModule,
    HttpModule,
    JsonpModule,
    FormsModule,
    ReactiveFormsModule,
    BrowserAnimationsModule,
    CoreModule,    
    NgbModule.forRoot(),   
    appRouting
  ],
  declarations: [
    AppComponent
  ],
  providers: [
    NotificationsService    
  ],
 bootstrap: [AppComponent]
})

app.routing.ts

import { NgModule, ModuleWithProviders } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';

export const appRoutes: Routes = [
    { path: '', redirectTo: 'home', pathMatch: 'full' },    
    { path: 'home', loadChildren: './home/home.module#HomeModule' },
    { path: 'business', loadChildren: './business/business.module#BusinessModule' }    
];
export const appRouting: ModuleWithProviders = RouterModule.forRoot(appRoutes);

businessModule

@NgModule({
  imports: [
    CommonModule,
    FormsModule, 
    ReactiveFormsModule,
    CoreModule,
    BusinessRouting
  ],
  declarations: [ 
    BusinessComponent, 
    HeaderComponent, 
    SidebarComponent, 
    AuthCompanyComponent, 
    LogoutCompanyComponent, 
    LoginCompanyComponent, 
    SignupCompanyComponent, 
    ForgotPasswordCompanyComponent, 
    BidsComponent, 
    ChangePasswordComponent
   ],
  providers: [
    BusinessAuthGuardService,
    DataService,
    BidService,
    NotificationsService
  ]
})
export class BusinessModule { }

从2017年10月27日起

更新

当我从延迟加载模块（BusinessModule）的基本组件（BusinessComponent）调用通知时，通知正常工作。但在我的懒惰模块中，我有路由器插座，它加载属于BusinessModule的其他组件。其中之一 - BidsComponent。当我尝试从这个组件调用Notification时 - 它不起作用......

business.router.ts

@NgModule（{

    imports: [
        RouterModule.forChild([
            {
              path: '',
              component: BusinessComponent,
              canActivate: [ BusinessAuthGuardService ],               
              children: [
                {
                  path: '',
                  redirectTo: 'bids',
                  pathMatch: 'full'
                },
                {
                  path: 'bids',
                  component: BidsComponent
                }
              ]
            }
        ])
    ],
    exports: [
        RouterModule
    ]
})
export class BusinessRouting {}

Answer 1

今天我尝试在plunkr中重新创建我的示例，我看到该项目在那里正常工作。问题出在我的实际应用中。我想要使​​用的组件通知数据库中的预期数据。在我的html模板中，我使用了数据（变量），这些数据在渲染时（分秒）未定义。它产生了一个错误，显然阻止了足够的通知服务。

通过在组件中使用* ngIf来解决问题，该组件具有未定义的数据。 * ngIf仅在数据集已满时帮助渲染组件。 我希望这个解决方案对某人有用。