Angular 6/7延迟加载模块,具有其他延迟加载模块所需的服务

我有一个角度应用程序,其中有一个核心模块和几个子模块,如core-routing.ts中所示

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { CoreComponent } from './components/core/core.component';
import { AuthGuard } from './auth.guard';

const routes: Routes = [
  {
    path: 'app',
    component: CoreComponent,
    children: [
      { path: '', redirectTo: 'invoice', pathMatch: 'full' },
      { path: 'providers', loadChildren: '../providers/providers.module#ProvidersModule' },
      { path: 'invoice', loadChildren: '../invoice/invoice.module#InvoiceModule' },
      { path: 'expenses', loadChildren: '../expenses/expenses.module#ExpensesModule' }

    ],
    canActivate: [AuthGuard]
  }
];

@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule],
})
export class CoreRoutingModule {}

在expenses模块中,我需要使用providersModule中公开的observate,如下所示

import { Component, OnInit, OnDestroy } from '@angular/core';
import { ExpenseService } from '../expense.service';
import { ProvidersService } from 'src/app/providers/providers.service';
import { SelectItem } from 'primeng/api';
import { Subscription } from 'rxjs';

@Component({
  selector: 'app-expenses',
  templateUrl: './expenses.component.html',
  styleUrls: ['./expenses.component.css'],
})
export class ExpensesComponent implements OnInit, OnDestroy {
  serviceProviders: SelectItem[] = [];

  cols: any[];

  yearFilter: number;

  sliderTimeout: any;

  selectedRow;

  private subscription: Subscription;

  constructor(public expenseService: ExpenseService, private providerService: ProvidersService) {}

  ngOnInit() {
    this.cols = [
      { field: 'humanDate', header: 'Creation Date' },
      { field: 'serviceProviderName', header: 'Provider' },
      { field: 'invoiceId', header: 'Invoice ID' },
      { field: 'paymentOption', header: 'Payment Type' },
      { field: 'paymentTransactionId', header: 'Payment ID' },
      { field: 'amount', header: 'Amount' },
      { field: 'description', header: 'Description' },
    ];
    //setTimeout(() => this.getProviders(), 1000);
    this.getProviders();
  }

  ngOnDestroy() {
    this.subscription.unsubscribe();
  }

  onRowSelect(expense) {
    this.expenseService.showDetailEvent.emit(expense);
  }

  onSliderChange(event, dt) {
    if (this.sliderTimeout) {
      clearTimeout(this.sliderTimeout);
    }

    this.sliderTimeout = setTimeout(() => {
      dt.filter(event.value, 'amount', 'gt');
    }, 250);
  }

  getProviders() {
    this.subscription = this.providerService.providers$.subscribe(providers => {
      this.serviceProviders = [];
      this.serviceProviders.push({ label: 'Provider', value: null });
      providers.map(provider => {
        this.serviceProviders.push({ label: provider.companyName, value: provider.id });
      });
    });
  }

  getName(event) {
    const label = this.serviceProviders.filter(x => x.value === event.serviceProviderName);
    if (label && label[0]) {
      return label[0].label;
    } else {
      return event.serviceProviderName;
    }
  }
}

当我第一次导航到expenses模块时,我看到来自providers服务的信息不在那里,但是当我导航到另一个模块(不一定是providers模块)然后返回expenses模块时,我可以看到这些信息。

我想我对依赖注入有问题,但我不确定在哪里

p.s.-我试图在expenses模块中用ProvidersService声明providers数组,但它没有解决问题