title: Dependency Injection in Angular 2 with ES5
body: <p>Suppose I've got two separate <code>components</code>. One defines the <code>my-app</code> element, one defines the <code>child</code> element.</p>
  
  <p>I want the <code>child</code> component to be a dependency of the <code>my-app</code> (root) component.</p>
  
  <p>How is this done?</p>
  
  <p><strong>myapp.component.js</strong></p>
  
  <pre><code>(function(app) {
    app.AppComponent = ng.core
      .Component({
        selector: 'my-app',
        template: '&lt;h1&gt;My First Angular 2 App!!&lt;/h1&gt;'
      })
      .Class({
        constructor: function() {}
      });
  })(window.app || (window.app = {}));
  </code></pre>
  
  <p><strong>child.component.js</strong></p>
  
  <pre><code>(function(app) {
    app.ChildComponent = ng.core
      .Component({
        selector: 'child',
        template: '&lt;h3&gt;This is the child&lt;/h3&gt;',
  
      })
      .Class({
        constructor: function() {}
      });
  })(window.app || (window.app = {}));
  </code></pre>