Javascript Angular/Typescript-获取循环依赖项的警告

我在当前项目中面临循环依赖警告。我需要一些帮助来解决这个警告问题。我搜索了StackOverflow或技术博客来解决这个问题。不幸的是，我没有找到合适的解决办法。如果有人帮我做这件事会更好

下面是项目文件夹结构。

src
 app
  services
   slice
    slice.service.ts
  slices
   home
    help
     help.component.html
     help.component.ts
    home.module.ts
   index.ts

检测到循环依赖项中的警告： src\app\slice\home\help\help.component.ts->src\app\services\slice\slice.service.ts-> src\app\slices\index.ts->src\app\slices\home\help\help.component.ts

help.component.ts

import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core'
import { select, Store } from '@ngrx/store'
import { Observable } from 'rxjs'

// components
import { BaseSliceComponent } from '@app/components/slice/base-slice.class'

// services
import { SliceService } from '@app/services/slice/slice.service'

// models
import { SliceOptions } from '@app/models/slice/slice.model'

// selectors
import config from './store/victims.selector'

@Component({
  selector: 'app-help',
  templateUrl: './help.component.html',
  styleUrls: ['./help.component.scss'],
})
export class HelpComponent extends BaseSliceComponent implements OnInit {
  config: Observable<SliceOptions> = this.store.pipe(select(config))

  constructor(private store: Store<any>, private sliceService: SliceService) {
    super()
  }

  ngOnInit(): void {}

}

import {
  ComponentRef,
  Injectable,
  ViewContainerRef
} from '@angular/core'
import { Router } from '@angular/router'
import { Store } from '@ngrx/store'

import SliceMap from '@app/slices'

import { SliceNameKeys } from '@app/models/slice/slice.model'

@Injectable({
  providedIn: 'root'
})
export class SliceService {
  private sliceStack: ComponentRef<any>[] = []

  private sliceHost!: ViewContainerRef

  constructor(
    private store: Store<any>,
    private router: Router,
  ) {  }

  create(
    name: SliceNameKeys,
    id?: string | undefined,
    shouldClear?: boolean,
    index?: number
  ) {
    id = id ?? name // if no id specified keep name as id

    const slice = SliceMap[name]
  }

}

import { SliceNames } from '@app/models/slice/slice.model'

// components
import { AboutUsComponent } from './home/aboutus/aboutus.component'
import { HelpComponent } from './home/help/help.component'

const SliceMap: SliceNames = {
  help: HelpComponent,
  aboutUs: AboutUsComponent
}

export default SliceMap

export abstract class BaseSliceComponent {
  id = ''
}

基本切片.class.ts

import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core'
import { select, Store } from '@ngrx/store'
import { Observable } from 'rxjs'

// components
import { BaseSliceComponent } from '@app/components/slice/base-slice.class'

// services
import { SliceService } from '@app/services/slice/slice.service'

// models
import { SliceOptions } from '@app/models/slice/slice.model'

// selectors
import config from './store/victims.selector'

@Component({
  selector: 'app-help',
  templateUrl: './help.component.html',
  styleUrls: ['./help.component.scss'],
})
export class HelpComponent extends BaseSliceComponent implements OnInit {
  config: Observable<SliceOptions> = this.store.pipe(select(config))

  constructor(private store: Store<any>, private sliceService: SliceService) {
    super()
  }

  ngOnInit(): void {}

}

import {
  ComponentRef,
  Injectable,
  ViewContainerRef
} from '@angular/core'
import { Router } from '@angular/router'
import { Store } from '@ngrx/store'

import SliceMap from '@app/slices'

import { SliceNameKeys } from '@app/models/slice/slice.model'

@Injectable({
  providedIn: 'root'
})
export class SliceService {
  private sliceStack: ComponentRef<any>[] = []

  private sliceHost!: ViewContainerRef

  constructor(
    private store: Store<any>,
    private router: Router,
  ) {  }

  create(
    name: SliceNameKeys,
    id?: string | undefined,
    shouldClear?: boolean,
    index?: number
  ) {
    id = id ?? name // if no id specified keep name as id

    const slice = SliceMap[name]
  }

}

import { SliceNames } from '@app/models/slice/slice.model'

// components
import { AboutUsComponent } from './home/aboutus/aboutus.component'
import { HelpComponent } from './home/help/help.component'

const SliceMap: SliceNames = {
  help: HelpComponent,
  aboutUs: AboutUsComponent
}

export default SliceMap

export abstract class BaseSliceComponent {
  id = ''
}

---

没有合适的解决方案或工具可以在项目中自动找到循环依赖项

您只需要仔细检查每个不依赖于循环的服务和可注入服务

像

A->B和B->A

---

您还需要签入每个服务依赖项。

没有合适的解决方案或工具可以在您的项目中自动找到循环依赖项

您只需要仔细检查每个不依赖于循环的服务和可注入服务

像

A->B和B->A

---

您还需要签入每个服务依赖项。

能否共享BasicSliceComponent.ts？能否发布@app/slices和@app/models/slice/slice的内容。model@wlf-@app/slices只不过是app/slices/下的'index.ts'。希望这是清楚的now@AbhinavKumar-Addedyou正在sliceService中导入sliceMap，而不是sliceMap导入HelpComponent和HelpComponent导入sliceService。我想这就是问题所在@krrr25能否共享BasicSliceComponent.ts？能否发布@app/slices和@app/models/slice/slice的内容。model@wlf-@app/slices只不过是app/slices/下的'index.ts'。希望这是清楚的now@AbhinavKumar-Addedyou正在sliceService中导入sliceMap，而不是sliceMap导入HelpComponent和HelpComponent导入sliceService。我想这就是问题所在@KRR25