title: Problems with circular dependency and OOP in AngularJS
body: <h1>AngularJS + OOP is kinda sexy feature to use</h1>
  
  <p>Hi, I'm successfully using OOP with AngularJs for some time already (first started with  <a href="https://stackoverflow.com/questions/17389291/angularjs-with-oop-inheritance-in-action">angularjs with oop inheritance in action</a>), the provided approach allows you define your classes as angular services, which you can later extend or inherit from like that: </p>
  
  <pre><code>Application.factory('AbstractObject', [function () {
      var AbstractObject = Class.extend({
          virtualMethod: function() {
             alert("Hello world");
          },
          abstractMethod: function() { // You may omit abstract definitions, but they make your interface more readable
             throw new Error("Pure abstract call");
          }
      });
  
      return AbstractObject; // You return class definition instead of it's instance
  }]);
  
  Application.factory('DerivedObject', ['AbstractObject', function (AbstractObject) {
      var DerivedObject = AbstractObject.extend({
          virtualMethod: function() { // Shows two alerts: `Hey!` and `Hello world`
              alert("Hey!");
  
              this._super();
          },
          abstractMethod: function() {
              alert("Now I'm not abstract");
          }
      });
  
      return DerivedObject;
  }]);
  </code></pre>
  
  <p>Plunker: <a href="http://plnkr.co/edit/rAtVGAsNYggBhNADMeoT" rel="noreferrer">http://plnkr.co/edit/rAtVGAsNYggBhNADMeoT</a></p>
  
  <p>using the described approach gives you the ability to define classes that beautifully integrate into angular infrastructure. You get all sort of nifty features from two worlds - OOP and AngularJs. Dependency injection is free for your classes, and it makes your classes simple, allows putting a lot of boilerplate controller code into some base class that can be later reused.</p>
  
  <h1>However</h1>
  
  <p>AngularJs infrastructure blocks previously described approach from spreading it's wings on all 100%. The problem occurs when you try to define recursive class definitions (i.e. recursive aggregation), say you have two class definitions like <code>Blog</code> and <code>Tag</code></p>
  
  <pre><code>Application.factory('Blog', ['Tag', function (Tag) {
      var Blog = Class.extend({
          tags: function() {
              return this.tags;
          }
      });
  
      return Blog;
  }]);
  
  Application.factory('Tag', ['Blog', function (Blog) {
      var Tag = Class.extend({
          Blogs: function() {
             return this.blogs;
          }
      });
  
      return Tag;
  }]);
  </code></pre>
  
  <p>It won't work because both <code>Blog</code> and <code>Tag</code> are self-referencing themselves causing circular dependency.</p>
  
  <h1>P.S</h1>
  
  <p>The last thing, I have found kinda ugly solution that solves my problem in my specific case but doesn't work in general and as I said, it isn't pretty:</p>
  
  <pre><code>Application.factory('BlogNamespace', [function () {
      var Blog = Class.extend({
          tags: function() {
              return this.tags;
          }
      });
  
      var Tag = Class.extend({
          Blogs: function() {
             return this.blogs;
          }
      });
  
      return {
          Tag: Tag,
          Blog: Blog
      };
  }]);
  </code></pre>
  
  <h1>Question</h1>
  
  <p>The above fix won't work because namespaces may also be a subject of circular dependency. This means that it isn't solution to described problem but rather one level deeper problem now.</p>
  
  <p>Any suggestions on how it is possible to solve described problem in general case?</p>