title: Angular - pass data to host component upon routing to lazy loaded module
body: <p>I have a module with the following routing:</p>
  
  <pre><code>{
      path: '',
      component: PagesComponent,
      children: [
        {
          data: { test: 'snoop' },
          path: 'dashboard',
          loadChildren: './modules/dashboard/dashboard.module#DashboardModule',
        },
        {
          data: { test: 'dogg' },
          path: 'admin', 
          loadChildren: './modules/admin/admin.module#AdminModule' 
        }
      ]
    }
  </code></pre>
  
  <p>What I'd like to do is pass some data to the <code>PagesComponent</code> component, depending on which lazy loaded module you've loaded. </p>
  
  <p>So, in my <code>PagesComponent</code> I'd like to have something like this:</p>
  
  <pre><code>constructor(private route: ActivatedRoute) {
      this.route.data.subscribe(data =&gt; {
        console.log(data);
      });
    }
  </code></pre>
  
  <p>And the <code>data</code> param will then contain the data defined in the root. </p>
  
  <p>I know I can easily retrieve the data from the routes within the lazy loaded module component itself, but is it possible to get this data in the host component, i.e. <code>PagesComponent</code>?</p>
  
  <p>Background: I'd like to do this so I can display different data in the menu depending on which page you're currently on. </p>