Angular 2 template selector not known
<p>I'm trying to perform a simple template injection into a page, but I receive the following error at run time in the console window of chrome :</p>

<blockquote>
  <p>zone.js:388 Unhandled Promise rejection: Template parse errors:
  'recruiter-detail' is not a known element:</p>
  
  <ol>
  <li>If 'recruiter-detail' is an Angular component, then verify that it is part of this module.</li>
  <li>If 'recruiter-detail' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this component
  to suppress this message. ("[ERROR
  ->]"): AppComponent@0:0 ; Zone:  ; Task: Promise.then ; Value: Error: Template parse errors:(…)
  Error: Template parse errors: 'recruiter-detail' is not a known
  element:</li>
  <li>If 'recruiter-detail' is an Angular component, then verify that it is part of this module.</li>
  </ol>
</blockquote>

<p><strong>app.component.ts</strong></p>

<pre><code>import { Component } from '@angular/core';
import { RecruiterDetailsComponent } from "./recruiter/recruiter-details.component";

@Component({
    selector: 'pm-app',
    template: `&lt;recruiter-detail&gt;&lt;/recruiter-detail&gt;`
})
export class AppComponent {
    pageTitle: string = 'Agent details';
</code></pre>

<p><strong>recruiter-details.component.ts</strong>  this resides in a subfolder called recruiter</p>

<pre><code>import { Component } from '@angular/core';

@Component({
    selector: 'recruiter-detail',
    templateUrl: './app/recruiter/recruiter-details.component.html'
})
export class RecruiterDetailsComponent {
}
</code></pre>

<p>I'm using VS2015. under my wwwroot folder I have an app folder where main.ts, app.component.ts and app.module.ts reside. app has a subfolder of recruiter.</p>