检测到 Angular 4 循环依赖 [英] Angular 4 Circular dependency detected

问题描述

将 Angular Cli 升级到 1.3.1 我现在有一些警告

Upgrading Angular Cli to 1.3.1 I have some warnings now

WARNING in Circular dependency detected: src\app\work-sessions\work-session-list\work-session-list.routing.ts
-> src\app\work-sessions\work-session-list\index.ts -> src\app\work
-sessions\work-session-list\work-session-list.routing.ts

每个类都有这样的结构:

Every class have a structure like this:

work-session-list.routing.ts

import { Route } from '@angular/router';
import { WorkSessionListComponent } from './index';

export const WorkSessionRoutes: Route[] = [
  {
    path: '',
    component: WorkSessionListComponent
  },
];

Index.ts

export * from './work-session-list.component';
export * from './work-session-list.routing';

work-sessions-list.module.ts

import { WorkSessionListComponent } from './work-session-list.component';
import { WorkSessionRoutes } from './work-session-list.routing';
import { DataTableModule } from 'primeng/primeng';
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { RouterModule } from '@angular/router';

@NgModule( {
    imports: [RouterModule.forChild( WorkSessionRoutes ), CommonModule , FormsModule],

    declarations: [WorkSessionListComponent],
    exports: [WorkSessionListComponent]
} )

export class WorkSessionListModule { }

比在app.routing.ts

export const AppRoutes: Routes = [
      {
        path: 'workSession',
        loadChildren: './work-sessions/work-session-list/work-session-list.module#WorkSessionListModule'
      }
.
.
.

在app.module

 @NgModule({
imports: [
CommonModule,
BrowserAnimationsModule,
FormsModule,
RouterModule.forRoot(AppRoutes),
 })
  ],
  declarations: [
    AppComponent
  ]
  bootstrap: [AppComponent]
})
export class AppModule {}

我该如何解决这个问题?它有效，但我有很多警告

How can I solve this? It works but I have a lot of warnings

推荐答案

正如警告所说，work-session-list.routing.ts 依赖于 index.ts:

As the warning says, work-session-list.routing.ts depends on index.ts:

import { WorkSessionListComponent } from './index';

和index.ts依赖于work-session-list.routing.ts:

export * from './work-session-list.routing';

第一个依赖项不是必需的，因为您可以直接从其源文件中导入 WorkSessionListComponent:

The first dependency is not necessary, since you could import WorkSessionListComponent directly from its source file:

import { WorkSessionListComponent } from './work-session-list.component';

此更改应该可以解决问题.

This change should fix the problem.

这篇关于检测到 Angular 4 循环依赖的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！