title: Circular dependency in recursive objects (linked by calling static methods) in Angular
body: <p>It is possible to create tree / recursive objects in separate files and avoid <code>Circular dependency detected</code> warning using <em>Angular CLI</em> if I call methods from classes recursive?</p>
  
  <p><em>(Tested in angular 7)</em> I understand that this is a problem in dependency injection (<a href="http://misko.hevery.com/2008/08/01/circular-dependency-in-constructors-and-dependency-injection/" rel="noreferrer">article</a>), but what about the objects using as constructor for data from external api or for internal purposes? And if it is not good idea anyway, how do you solve it? (I suppose the answer for this 'subquestion' is a change of model, then how should I modify my model?) I search for solution but <a href="https://stackoverflow.com/questions/49072091/angular-5-circular-dependency-detected-between-models">the closest question</a> did not help me apply the same approach to my situation.</p>
  
  <p>I have <code>Emails</code> and <code>Attachments</code> (emails with attachments - and the entire <code>Email</code> with attachments can also be an attachment, <code>Attachment</code> is separated object with attributes and content can be <code>File</code> or <code>Email</code>, but here, for simplicity, suppose the attachment is always one <code>Email</code> or null).<br>
  Each <strong>class has static method</strong> for create instance from JSON object (I get JSON from API, then I will create instance of object representing API values by calling static <code>fromJson</code> method on top object):</p>
  
  <p><em>file: app/model/email.ts (part of code)</em></p>
  
  <pre class="lang-js prettyprint-override"><code>import { Attachment } from './attachment';
  
  export class Email {
    // some attributes
    public attachment?: Attachment;
  
    public static fromJson(js: JSON): Email {
      const e = new Email();
      // fill some attributes here
      if (js['attachment']) { e.attachment = Attachment.fromJson(js['attachment']); }
      return e;
    }
  }
  </code></pre>
  
  <p><em>file: app/model/attachment.ts (part of code)</em></p>
  
  <pre><code>import { Email } from './email';
  export class Attachment {
    // some attributes
    public content: Email;
  
    public static fromJson(js: JSON): Attachment {
      const a = new Attachment();
      // fill some attributes here
      if (js['email']) { a.content = Email.fromJson(js['email']); }
      return a;
    }
  }
  </code></pre>
  
  <p>Initial call is: <code>this.email = Email.fromJson(apiResponseForEmail);</code></p>
  
  <p>This situation result into <em>Circular dependency detected</em> warning after <code>ng build | serve</code>. If this is not a good example for you, you can imagine <code>Recipe</code> class for food which contains <code>Ingredients</code> with attributes such as quantity and temperature where the result of one <code>Recipe</code> is a ingredient for another recipe.</p>
  
  <p><strong>If these classes are in one file, no warning is reported.</strong> However, placing everything in one big file is not the best solution to me (if there is any other).</p>
  
  <p>Here is a <a href="https://stackblitz.com/edit/cirdepdemo" rel="noreferrer">Stackblitz with Circular dependency demo</a> (but without warnings in console, stackblitz obviously removes warnings, you need to download this code and run from localhost to see warning).</p>
  
  <p>I am interested if <strong>it is possible to place such classes (which are called in the code recursive by static method like in the example) in separate files (files named by classes) and avoid Circular dependency detected message</strong>?</p>