title: Am I using angular (2) modules correctly?
body: <p>I am developing the following demo app:</p>
  
  <p>A user is shown a list of countries (all displayed as a card with basic info and image). When a country is clicked they are routed into the detail of that country in which I also show a list of attractions for the country (e.g. the Eiffel tower and Louvre museum for France).</p>
  
  <p>Countries: </p>
  
  <p><a href="https://i.stack.imgur.com/47riy.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/47riy.jpg" alt="enter image description here"></a></p>
  
  <p>Country detail with list of attractions: </p>
  
  <p><a href="https://i.stack.imgur.com/g9lW3.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/g9lW3.png" alt="enter image description here"></a></p>
  
  <p>This is my project structure</p>
  
  <pre><code>/app
    /attractions
      /attraction (COMPONENT)
      /attraction-list (COMPONENT)
      attraction (CLASS)
      attraction.service
      attractions.routing
      attractions.module (EXPORTS 'AttractionListComponent')
    /countries
      /country (COMPONENT)
      /country-detail (COMPONENT, Uses '&lt;attraction-list&gt;&lt;/attraction-list&gt;')
      /country-list (COMPONENT)
      country (CLASS)
      country.service
      countries.module (IMPORTS AttractionsModule)
      countries.routing
    app.module (IMPORTS CountriesModule)
    app.routing
  </code></pre>
  
  <p>Everything works but I do have some questions:</p>
  
  <ul>
  <li>Is my architecture following good practices? If not, what should I change?</li>
  <li>Are my module imports correct, e.g. should I import AttractionsModule in the root AppModule (When I did this it complained because CountryDetail couldn't recognise <code>&lt;attraction-list&gt;&lt;/attraction-list&gt;</code></li>
  <li>What will happend when I incorporate lazy loading, how will it affect my setup?</li>
  </ul>
  
  <p>Thanks in advance!</p>