title: Angular2: Lazy Loading without Routing and Dynamic Loading
body: <p>I am using mgechev's angular2 seed for my project. I am working on Angular2 for last 6 months (following the world with all the RCs to Final release). I am stuck with a requirement my client has. I wish you guys could help.</p>
  
  <p>Here is the problem. Base on user role:</p>
  
  <p><code>ROLE_ADMIN</code></p>
  
  <p><code>ROLE_REVIEWER</code></p>
  
  <p>Web app should be able to load specific modules and display. Say,</p>
  
  <ul>
  <li>if user role is <code>ROLE_ADMIN</code> then load angular2 modules <code>Module1</code> &amp;
  <code>Module2</code> </li>
  <li>if user role is <code>ROLE_REVIEWER</code> then load angular2 modules
  <code>Module1</code> only.</li>
  </ul>
  
  <p>When I say load, it means it must fetch the module files (everything that is bundled with the module) from the server, inject into Angular2 app and display that module.</p>
  
  <p>So, if the user role is <code>ROLE_REVIEWER</code> I shall be able to see only <code>Module1</code> that means <code>Module2</code> should not be even fetched from the server. </p>
  
  <p><strong>EDIT</strong>
  Here is difficult part, url is not changed while doing it. Consider this module as widgets which loads on your dashboard <code>/dashboard</code>. Thus no url change is expected while loading these modules.</p>
  
  <p>Hope my question is explanatory enough. Please suggestion what all I should do or research or study to achieve this. </p>
  
  <p>My best guess, I have to do the following:</p>
  
  <ul>
  <li>Conditional lazy loading (without routing) &amp; then,</li>
  <li>Dynamic Loading</li>
  </ul>
  
  <p>But I do not know how.</p>