#5: Remove customer

src/ng2client/app/components/adminCustomerList/adminCustomerList.html

@@ -1,3 +1,3 @@
 <div id="list" class="pure-u-1">
-    <nfn-admin-customer-list-item template="ngFor #customer of customers" [customer]="customer"></nfn-admin-customer-list-item>
+    <nfn-admin-customer-list-item template="ngFor #customer of customers" [customer]="customer" (onDeleted)="refresh()"></nfn-admin-customer-list-item>
 </div>

src/ng2client/app/components/adminCustomerList/adminCustomerList.ts

@@ -16,6 +16,10 @@ export class AdminCustomerListComponent implements OnInit {
     }
 
     ngOnInit(): any {
+        this.refresh();
+    }
+
+    private refresh() {
         this._customerApiService.list()
             .subscribe(res => this.customers = res);
     }

src/ng2client/app/components/adminCustomerListItem/adminCustomerListItem.html

@@ -7,4 +7,7 @@
         <h5 class="email-name">{{ customer.firstName }} {{ customer.lastName }}</h5>
         <h4 class="email-subject">Customer</h4>
     </div>
+    <div class="pure-u-1-4">
+        <button class="pure-button pure-button-primary" (click)="removeCustomer()">Delete</button>
+    </div>
 </div>

src/ng2client/app/components/adminCustomerListItem/adminCustomerListItem.ts

@@ -1,5 +1,6 @@
-import {Component, Input} from 'angular2/core';
+import {Component, Input, Output, EventEmitter} from 'angular2/core';
 import {CustomerModel} from '../../model/customerModel';
+import {CustomerApiService} from '../../services/customerApiService';
 
 @Component({
     selector: 'nfn-admin-customer-list-item',
@@ -9,4 +10,15 @@ import {CustomerModel} from '../../model/customerModel';
 export class AdminCustomerListItemComponent {
     @Input()
     public customer: CustomerModel;
+
+    @Output()
+    public onDeleted: EventEmitter = new EventEmitter();
+
+    constructor(private _customerApiService: CustomerApiService) {
+    }
+
+    private removeCustomer() {
+        this._customerApiService.remove(this.customer.id)
+            .subscribe(() => this.onDeleted.emit(null));
+    }
 }

src/ng2client/app/services/customerApiService.ts

@@ -36,6 +36,15 @@ export class CustomerApiService {
             .toArray();*/
     }
 
+    public remove(userId: number): Observable {
+        const headers = this.createHeaders();
+        const endpoint = `${this._urlService.apiUrl}customer/${userId}`;
+
+        return this._http.delete(endpoint, {
+            headers: headers
+        });
+    }
+
     private createHeaders(): Headers {
         const headers: Headers = new Headers();
         headers.append('Content-Type', 'application/json');