title: Importing a component from another component
body: <p>I'm trying to call a child component's function from a parent component.</p>
  
  <p>As I understand, the best way to go about this is to use ViewChild.</p>
  
  <p>I understand the logic of it all, but for some reason I can't import the child component into the parent component, it gives me the error: </p>
  
  <p><strong>Cannot find module '../claim-header/claim-header.component'.</strong></p>
  
  <p>This is the import section in my parent component: (Claim)</p>
  
  <p><code>import { ClaimHeaderComponent } from '../claim-header/claim-header.component';</code></p>
  
  <p>I've tried them all:</p>
  
  <pre><code>import { ClaimHeaderComponent } from './claim-header';
  import { ClaimHeaderComponent } from './claim-header/claim-header';
  import { ClaimHeaderComponent } from '../claim-header';
  import { ClaimHeaderComponent } from '../../components/claim-header-component';
  </code></pre>
  
  <p>etc.</p>
  
  <p>For reference, the rest of the imports work fine as long as they're not components:</p>
  
  <pre><code>import { ClaimDetail } from '../../modules/models/claim';
  import { ClaimsService } from '../../modules/services/claims.service';
  </code></pre>
  
  <p>This is the declaration of my child component:</p>
  
  <pre><code>@Component({
      moduleId: module.id,
      selector: 'fhp-claim-header',
      templateUrl: 'claim-header.component.html'
  })
  
  export class ClaimHeaderComponent implements OnInit {
     ...
  }
  </code></pre>
  
  <p>And my folder layout:</p>
  
  <p><a href="https://i.stack.imgur.com/jyIOd.png" rel="nofollow noreferrer">Folder layout</a></p>