防止 Angular 编译的循环依赖错误

Question

I use WebStorm (great IDE) and I'm working on a custom pet project of mine which will become a game eventually. But I'm developing a bare bones Alpha version to show off to potential employers because I'm looking for work and want to add this project to my resume. Anyway, I'm using the Builder design pattern to create very complex objects. Some of these objects are spread across several different services because it makes more sense to do it that way. The game I'm making is going to be a text-based RPG where players can create characters, go to different locations, gather items, etc. So IDK how to get around needing multiple services which multiple Builder objects, but when I combined them all into a "super object"...I get a circular dependency error.

I tried installing NestJS because Nest has a way around Circular Dependency errors and I believe I did everything right, but I'm still getting the same error.

https://docs.nestjs.com/fundamentals/circular-dependency

As you can see below, it does build a localhost, but of course it doesn't do anything.

Terminal Error Image

Here's a small example from two Service files. The Nest docs say I need the ForwardRef in both Services files, not one which I have here. I've also of course installed the packages @nestjs/common and @nestjs/core. I've also tested a couple other Builder objects that don't depend on another service and they display to the console just fine. So I know the source of my problem are these Circular Dependencies.

decisions.service.ts

import { DecisionBuilder } from '../../../../Shared/builder';
import { DecisionType } from '../../../Gameplay/structs';
import { ChapterOneService } from './chapter-one.service';
import { forwardRef, Inject } from '@nestjs/common';

@Injectable({
  providedIn: 'root'
})
export class DecisionsService
{
  commonOne = DecisionBuilder.create({
    decisionType: DecisionType.Common,
    agendaScore: DecisionType.Common.valueOf(),
    agendaImpact: 'Moderate',
    currentPage: this.chapOne.PageOne,
    nextPage: this.chapOne.PageTwo
  });
  commonTwo = DecisionBuilder.create({
    decisionType: DecisionType.Common,
    agendaScore: DecisionType.Common.valueOf(),
    agendaImpact: 'Idealist',
    currentPage: this.chapOne.PageOne,
    nextPage: this.chapOne.PageTwo
  });
  commonThree = DecisionBuilder.create({
    decisionType: DecisionType.Common,
    agendaScore: DecisionType.Common.valueOf(),
    agendaImpact: 'Extremist',
    currentPage: this.chapOne.PageOne,
    nextPage: this.chapOne.PageTwo
  });

  constructor(
    @Inject( forwardRef(() => ChapterOneService) )
    private chapOne: ChapterOneService )
  {

  }

}

The above Decision Service only depends on one other service and that's the one before. But I use the product of the service as a value for currentPage and nextPage

chapter-one.service.ts

import { AdventurePageBuilder } from '../../../../Shared/builder';
import { LocationsService } from './locations-service';
import { CharacterService } from '../../character.service';
import { DecisionsService } from './decisions.service';
import {forwardRef, Inject} from '@nestjs/common';

@Injectable({
  providedIn: 'root'
})
/**
 *  CHAPTER ONE
 *  - Chapter Service that contains all Page objects
 *  - Each Chapter component accesses this one service for all content
 */
export class ChapterOneService
{

  PageOne = AdventurePageBuilder.create({
    name: this.location.getShip().area,
    location: this.location.getShip(),
    character: this.character.Krellen,
    storyText: this.pageOneStory(),
    descriptors: this.pageOneDesc(),
    decisionEvents: this.decisions.commonOne
  });
  PageTwo = AdventurePageBuilder.create({
    name: this.location.getShipTwo().area,
    location: this.location.getShipTwo(),
    character: this.character.Krellen,
    storyText: this.pageTwoStory(),
    descriptors: this.pageTwoDesc(),
    decisionEvents: this.decisions.commonOne
  });

  constructor(
    @Inject( forwardRef(() => LocationsService))
    @Inject( forwardRef(() => CharacterService))
    @Inject( forwardRef(() => DecisionsService))
    private location: LocationsService,
    private character: CharacterService,
    private decisions: DecisionsService)
  {

  }

  /***************************************/
  /****************PAGE ONE**************/
  /***************************************/
  getPageOne(): any
  {
    return this.PageOne;
  }

  pageOneStory(): string
  {
    return `${this.PageOne.name} was dark was dreary. Much to ${this.PageOne.character.name}'s dismay`;
  }
  pageOneDesc(): any
  {
    // See if character carries any items with descriptions. Guns, armor, ect.
  }
  /***************************************/
  /****************PAGE TWO***************/
  /***************************************/

  getPageTwo(): any
  {
    return this.PageTwo;
  }

  pageTwoStory(): string
  {
    return `${this.PageTwo.name} was dark was dreary. Much to ${this.PageTwo.character.name}'s dismay`;
  }
  pageTwoDesc(): any
  {
    // See if character carries any items with descriptions. Guns, armor, ect.
  }

  displayHolodeckPage()
  {
    return this.PageOne;
  }

}

Some of the code from above can be ignored as I don't think they're directly the problem...I just wanted to show that I use the ForwardRef in this file too as well as the other Services that are used in chapter-one.service.ts

Click on the error image link above to see the error code I get, but any help is welcomed. Whether it's a fix to the circular error problem or a way to refactor the code so I can essentially get the same result by doing something differently.

Answer 1

NestJS has project structure and Dependency Injection system that is somewhat inspired by Angular but they are completely different frameworks. You cannot use NestJS decorators inside of an Angular app and expect it to do anything. You need to fix the problem in your Angular app. Don't install backend framework dependencies into a frontend app