title: Multiple Components in angular2
body: <p>I'm new to angular 2 , In multiple components i have written a two components in a single folder file i have import the 2nd class in first file and given directive: class but its showing error!
  Here the app.module.ts file</p>
  
  <pre><code>import { NgModule }      from '@angular/core';
  import { BrowserModule } from '@angular/platform-browser';
  import { AppComponent }   from './app.component';
  @NgModule({
      imports:      [ BrowserModule ],
      declarations: [ AppComponent ],
      bootstrap:    [ AppComponent ]
   })
  export class AppModule { }
  </code></pre>
  
  <p>Here the first component file app.component.ts</p>
  
  <pre><code>import { Component } from '@angular/core';
  import { mydetailsComponent } from './app.details';
  
  @Component({
     selector: 'my-app',
     template: `&lt;h1&gt;Welcome to this Application...&lt;/h1&gt;
     &lt;p&gt;We have the App details here:&lt;/p&gt;
     &lt;mydetails&gt;&lt;/mydetails&gt;
     `
    directives: [ mydetailsComponent ] })
  export class myAppComponent { }
  </code></pre>
  
  <p>Here second Component file app.details.ts</p>
  
  <pre><code>import { Component } from '@angular/core';
  @Component({
    selector: 'mydetails',
    template: `&lt;ul&gt;
               &lt;li&gt;Settings&lt;/li&gt;
               &lt;li&gt;Profile&lt;/li&gt;
               &lt;li&gt;Games&lt;/li&gt;
               &lt;li&gt;Gallery&lt;/li&gt;
              `
  })
  export class mydetailsComponent { }
  </code></pre>
  
  <p>Please tell us how to use and display the multiple components!</p>