title: Importing a Component from a lazy-loaded Module into another lazy-loaded Module
body: <p>I have followed the Tour-of-Hero tutorial on Angular2 official page. But I took it a step further by introducing Modules lazy-loading.</p>
  
  <p>I've got the following Feature Modules:</p>
  
  <ul>
  <li><p>Module <code>Dashboard</code></p>
  
  <ul>
  <li>dashboard component</li>
  </ul></li>
  <li><p>Module <code>Hero</code></p>
  
  <ul>
  <li>hero-list component</li>
  <li>hero-detail component</li>
  <li>hero-search component</li>
  <li>hero-search service</li>
  <li>hero model</li>
  </ul></li>
  </ul>
  
  <p>The <strong>hero-search</strong> component is a directive that should be used in the Dashboard Module.</p>
  
  <p>However, according to <a href="https://angular.io/docs/ts/latest/guide/architecture.html" rel="nofollow">this documentation</a> about Angular2 architechture, Routed module <em>should not be imported</em> by others. Meaning, I should not import the Hero module into the Dashboard module. If I do, my routes are no longer working anyway.</p>
  
  <p>Also the hero-search component uses a <strong>hero-service</strong> and the <strong>hero-model</strong>, so <strong>it has strong dependencies on Hero Module</strong>, making it hard to externalize.</p>
  
  <p>So how am I supposed to use the hero-search component in the Dashboard component ? </p>