Javascript angular/typescript中的循环依赖关系

我在angular项目中面临循环依赖。我遇到了很多解决方案，包括按照这里的说明从“单个文件”导出所有依赖类 没用。因此，我转向了不同的解决方案，如按照以下链接中的说明使用依赖注入：

但是尽管使用依赖注入，仍然有例外。 代码如下：

模块A.ts

import { MODULE_B_NAME } from "./moduleB";
import { Injectable, Injector } from "@angular/core";


export const MODULE_A_NAME = 'Module A';
@Injectable({
  providedIn: 'root'
})
export class ModuleA {

  private tempService: any;
  constructor(private injector: Injector) {
    setTimeout(() => this.tempService = injector.get(MODULE_B_NAME));

  }


  public  getName(): string {

    this.tempService.getName();
    return "we are forked";
  }

}

模B.ts

import { MODULE_A_NAME } from "./moduleA";
import { Injectable, Injector } from "@angular/core";

export const MODULE_B_NAME = 'Module B';
@Injectable({
  providedIn: 'root'
})
export class ModuleB {

  private tempService: any;
  constructor(private injector: Injector) {

    setTimeout(() => this.tempService = injector.get(MODULE_A_NAME));


  }
  public getName(): string {

    //this.tempService = this.injector.get(MODULE_A_NAME);
    this.tempService.getName();
    return "we are forked";
  }

}

appComponent.ts

import { Component } from '@angular/core';
import { ModuleA } from './moduleA';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'test01';


  getSomething() {

    return ModuleA.name;
  }



}

appModules.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';
import { ModuleA } from './moduleA';
import { ModuleB } from './moduleB';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule
  ],
  providers: [ModuleA, ModuleB],
  bootstrap: [AppComponent]
})
export class AppModule { }

有人能看一下密码和身份证吗？有什么问题吗 谢谢

---

问题在于，您的模块名称导出与模块本身在同一个文件中。您应该创建一个名为

module names.const.ts

的单独文件：

export const MODULE_A_NAME = 'Module A';
export const MODULE_B_NAME = 'Module B';

然后，您可以在两个模块中导入此文件，而无需循环依赖项：

import { MODULE_A_NAME } from "./module-names.const";

import { Injectable, Injector } from "@angular/core";

@Injectable({
  providedIn: 'root'
})
export class ModuleB {
  constructor(private injector: Injector) {
    setTimeout(() => this.tempService = injector.get(MODULE_A_NAME));
  }
}

然而，你想做什么？感觉上你在做一些你绝对不应该做的事情。（或在任何其他编程环境中）。我敢肯定，一旦应用程序使用

--prod

标志编译完毕，您的模块名称就会有所不同，您尝试执行的任何操作都将不再有效

---

在您的情况下，您需要第三种服务。一个同时注入服务A和服务B的服务。这个服务C应该处理您想要做的事情

问题是您的模块名导出与模块本身在同一个文件中。您应该创建一个名为

module names.const.ts

的单独文件：

export const MODULE_A_NAME = 'Module A';
export const MODULE_B_NAME = 'Module B';

然后，您可以在两个模块中导入此文件，而无需循环依赖项：

import { MODULE_A_NAME } from "./module-names.const";

import { Injectable, Injector } from "@angular/core";

@Injectable({
  providedIn: 'root'
})
export class ModuleB {
  constructor(private injector: Injector) {
    setTimeout(() => this.tempService = injector.get(MODULE_A_NAME));
  }
}

然而，你想做什么？感觉上你在做一些你绝对不应该做的事情。（或在任何其他编程环境中）。我敢肯定，一旦应用程序使用

--prod

标志编译完毕，您的模块名称就会有所不同，您尝试执行的任何操作都将不再有效

---

在您的情况下，您需要第三种服务。一个同时注入服务A和服务B的服务。这个服务C应该处理您想要做的事情

不建议使用相同类型的循环依赖项。相反，您应该使用一些服务/接口来相互协作组件。

不建议使用相同类型的循环依赖项。相反，您应该使用一些服务/接口来相互协作组件。

为什么这两个服务相互引用？他们有什么共同点？通常，如果您有一个循环依赖项，那么您应该考虑一个更深层次的设计问题。重构代码，以便通过将公共代码抽象或移动到单个位置来打破循环依赖关系。如果没有相关的实际代码，很难说这到底是什么样子。为什么这两个服务相互引用？他们有什么共同点？通常，如果您有一个循环依赖项，那么您应该考虑一个更深层次的设计问题。重构代码，以便通过将公共代码抽象或移动到单个位置来打破循环依赖关系。如果没有所讨论的实际代码，很难说它到底是什么样子。这是一个示例代码。。我在另一个规模更大的项目中遇到了这个问题。。所以我创建了这个来强调循环依赖性。谢谢，这是一个示例代码。。我在另一个规模更大的项目中遇到了这个问题。。所以我创建了这个来强调循环依赖性。谢谢，这很有帮助