Question

VendasModule导入路由器
导入父级组件
导入子组件
导入服务（我想成为@injectable提供者：VendasModule）
这将导入VendasModule（将在@injectable装饰器中使用）
检测到循环依赖！

关于如何解决此问题的任何想法？我需要所有这些进口商品，不是吗？

VendasModule:
@NgModule({
  imports: [
    CommonModule,
    RouterModule.forChild(VendasRoutes),
    FlexLayoutModule,
    ReactiveFormsModule,
    MatCardModule,
    MatInputModule,
    MatButtonModule,
    MatProgressBarModule,
    MatRadioModule,
    MatSelectModule,
    MatTabsModule,
    MatDatepickerModule,
    MatTableModule,
    MatCheckboxModule,
    MatDialogModule,
    MatIconModule,
    MatStepperModule,
    MatListModule,
    MatAutocompleteModule,
    SharedModule,
    FormsModule,
    NgxCurrencyModule.forRoot(customCurrencyMaskConfig),
    CustomFormsModule,
    MatExpansionModule,
    MatChipsModule,
    MatTooltipModule,
    MatProgressSpinnerModule,
      ], (...)

VendasRouting:
export const VendasRoutes: Routes = [
    {
        path: '',
        canActivateChild: [Menu],
        children: [
            {
                path: 'cadastro-contrato',
                component: CadastroContratoComponent
            },
            {
                path: 'plano-comercial',
                component: PlanoComercialComponent
            },
            {
                path: 'check-list',
                component: CheckListComponent
            },
            {
                path: 'plano-emissoras',
                component: PlanoEmissorasComponent((FATHER COMPONENT))
            }

        ]
    }
]

Father Component:
export class PlanoEmissorasComponent implements OnInit, OnDestroy { 
  @ViewChild(ProspectEmissorasComponent) prospectEmissoras: ProspectEmissorasComponent; ((Child Component))
  @ViewChild(NegociacaoEmissorasComponent) negociacaoEmissoras: NegociacaoEmissorasComponent;
  @ViewChild(FinancEmissorasComponent) financEmissoras: FinancEmissorasComponent;
  @ViewChild(ContratoEmissorasComponent) contratoEmissoras: ContratoEmissorasComponent;

Service:
import { VendasModule } from "../../../vendas.module";

@Injectable({
    providedIn: VendasModule
})
export class PlanoEmissorasService { ... }

我收到此错误：

WARNING in Circular dependency detected:
src/app/vendas/vendas.routing.ts -> src/app/vendas/cadastro-contrato/plano-emissoras/plano-emissoras.component.ts -> src/app/vendas/cadastro-contrato/plano-emissoras/prospect-emissoras/prospect-emissoras.component.ts -> src/app/vendas/cadastro-contrato/plano-emissoras/services/plano-emissoras.service.ts -> src/app/vendas/vendas.module.ts -> src/app/vendas/vendas.routing.ts

Answer 1

当TypeScript编译器尝试解析循环导入时，循环引用在您的代码中，由TypeScript编译器生成。您可以采用以下任一解决方案：

使用providers的{{1}}数组提供您的服务。
在根级别VendasModule上建立服务injectable，这将有助于树的摇动。
在另一个模块中使用@Injectable({ providedIn: 'root' })并将其导入providedIn
```
VendasModule
```
在您的VendasModule中使用此模块
```
 @Injectable({ providedIn: SomeModule})
 export class PlanoEmissorasService {}
```

Check this comment out on angular repo.

@Injectable（{providedIn：Module}）=>循环依赖（ROUTES）

1 个答案: