Angular 2 app cannot find my directory -

in console in browser says:

app/app.module.ts(4,33): error ts2307: cannot find module 'customer/app.customer'. app/customer/app.customer.service.ts(1,29): error ts2307: cannot find module 'customer/app.customer.model'. app/customer/app.customer.ts(2,29): error ts2307: cannot find module 'customer/app.customer.model'. app/customer/app.customer.ts(3,31): error ts2307: cannot find module 'customer/app.customer.service'. 

those files created!

this basic app. did make new directory , generated project angular's quickstart guide.

main.ts

import { platformbrowserdynamic } '@angular/platform-browser-dynamic';  import { appmodule } './app.module';  platformbrowserdynamic().bootstrapmodule(appmodule); 

app.module.ts

@ngmodule({   imports: [ browsermodule ],   declarations: [ appcomponent, customercomponent ],   bootstrap: [ appcomponent ] }) export class appmodule { } 

app.component

@component({     selector: 'my-app',     template: '<customer></customer>' }) export class appcomponent { } 

this files created in customer directory

app.customer.model

export class customermodel {      firstname:string = "";     lastname:string = "";      constructor(title:string = ""){      }  } 

app.customer.service

import {customermodel} 'customer/app.customer.model'; import {injectable} '@angular/core';  @injectable() export class customerservice {      customerlist:customermodel[] = [         new customermodel("mr."),         new customermodel("miss."),         new customermodel("ms."),     ];  } 

app.customer.ts

import {component} '@angular/core'; import {customermodel} 'customer/app.customer.model'; import {customerservice} 'customer/app.customer.service';  @component({     moduleid: module.id,     selector: 'customer',     templateurl: './customer.html' })  export class customercomponent {      customer:customermodel = new customermodel();      constructor(public service:customerservice){      }      onsubmit(){         this.service.customerlist.push(this.customer);     } } 

customer.html

<div>      <form (submit)="onsubmit()">          <label>fistname:             <input type="text" name="firstname" [(ngmodel)]="customer.firstname">         </label>          <label>fistlast:             <input type="text" name="lastname" [(ngmodel)]="customer.lastname">         </label>          <button type="submit">submit</button>     </form>      <ul>         <li *ngfor="let customers of service.customerlist">             {{customers.value}}             {{customers.firstname}}             {{customers.lastname}}         </li>     </ul>  </div> 

i posted on git @ git hub

i think there's problem import statements in each of files.

app.module.ts

import { customercomponent } './customer/app.customer; 

app.customer.service

import { customermodel } './app.customer.model'; 

app.customer.ts

import { customermodel } './app.customer.model'; import { customerservice } './app.customer.service';