Question

https://github.com/angular/angular-cli/pull/6813添加了循环依赖关系的警告，我知道我可以使用“showCircularDependencies”关闭所有警告：false 。但我宁愿保持循环依赖警告。 是否有一种模式可以让我修复下面的用例，或者有没有办法专门禁用特定文件上的循环依赖插件？

最简单的方案是如果我有3个文件：

forms.model.ts

import { CustomModel } from './custom.model';
import { CustomForm } from './custom.form';

export class Forms {
  items: CustomForm[] = [];
  public constructor(models?: CustomModel[]) {
    models.forEach(model => this.items.push(new CustomForm(model)));
  }
}

custom.model.ts

export class CustomModel {
  nestedModels: CustomModel[];    
}

custom.form.ts

import { Forms } from './forms.model';
import { CustomModel } from './custom.model';

export class CustomForm {
  nestedForms: Forms;

  constructor(model: CustomModel) {
    this.nestedForms = new Forms(model.nestedModels);
  }
}

这会导致以下警告：

WARNING in Circular dependency detected:
src\app\models\custom.form.ts -> src\app\models\forms.model.ts -> src\app\models\custom.form.ts

WARNING in Circular dependency detected:
src\app\models\forms.model.ts -> src\app\models\custom.form.ts -> src\app\models\forms.model.ts

在我的实际应用程序中，由于同样的模式，大约有20-30个警告。我认为底层插件https://github.com/aackerman/circular-dependency-plugin支持排除模式，但我不确定是否可以通过angular-cli使用它。

Answer 1

问题很明显：

您正在custom.form.ts

中使用custom.form.ts

以及custom.model.ts加入CircularDependencies，

这称为import { CustomForm } from './custom.form';，但这并不好。

解决方案：

只需从custom.model.ts

中删除

=If(Or(A1 = $D$1, A1 = $D$2, A1 = $D$3, ... A1 = $D$10), 1, -1000)

即可

Answer 2

您还可以通过在 angular.json 文件中添加以下行来隐藏这些循环 CI 警告

            "build": {
                "options": {
                    .....,
                    "showCircularDependencies": false
                },
                "configurations": {
                ....
                }
            },
            "serve": {
                ....
            },
        }```

Answer 3

您可以在同一个文件中使用forms.model.ts和custom.form.ts的代码，这将删除循环依赖项。

Answer 4

forms.model.ts使用custom.form.ts，custom.form.ts使用forms.model.ts，这是依赖循环的原因，请通过更改模型来删除此关系。

在没有CustomForm的情况下如何创建Forms，并且由于没有Forms而不能创建CustomForm？（是的，可以使用null或undefined，但这是丑）

forms.model.ts

import { CustomModel } from './custom.model';
import { CustomForm } from './custom.form';

export class Forms {
  items: CustomForm[] = []; /** refences to CustomForm **/
  public constructor(models?: CustomModel[]) {
    models.forEach(model => this.items.push(new CustomForm(model)));
  }
}

custom.form.ts

import { Forms } from './forms.model';
import { CustomModel } from './custom.model';

export class CustomForm {
  nestedForms: Forms; /** refences to Forms **/

  constructor(model: CustomModel) {
    this.nestedForms = new Forms(model.nestedModels);
  }
}

Answer 5

我想在此对话中补充一点，如果您有循环依赖警告，并且它不是由从桶文件中以某种方式相互交叉引用的导入引起的，则可能是 provideIn: root 导致循环依赖警告.

@Injectable({provideIn: root}) 这使得我的一项服务被提供两次或在编译时不应该提供的文件中提供。

检测到循环依赖关系中的警告 - Angular Cli

5 个答案: