midway through user creation, looking into oauth2

src/pages/signup/signup.html

@@ -16,30 +16,30 @@
   
     <ion-item>
       <ion-label stacked>First name</ion-label>
-      <ion-input placeholder="First Name" type="text" required #firstName></ion-input>
+      <ion-input formControlName="firstName" placeholder="First Name" type="text" required #firstName></ion-input>
     </ion-item>
 
     <ion-item>
       <ion-label stacked>Last name</ion-label>
-      <ion-input placeholder="Last Name" type="text" required #lastName></ion-input>
+      <ion-input formControlName="lastName" placeholder="Last Name" type="text" required #lastName></ion-input>
     </ion-item>
 
     <ion-item>
       <ion-label stacked>E-mail</ion-label>
-      <ion-input placeholder="Email" type="text" required #email></ion-input>
+      <ion-input formControlName="email" placeholder="Email" type="text" required #email></ion-input>
     </ion-item>
 
     <ion-item>
       <ion-label stacked>Password</ion-label>
-      <ion-input placeholder="Password" type="text" required #password></ion-input>
+      <ion-input formControlName="password" placeholder="Password" type="text" required #password></ion-input>
     </ion-item>
 
     <ion-item>
       <ion-label stacked>Re-enter password</ion-label>
-      <ion-input placeholder="Re-enter Password" type="text" required #passwordreentry></ion-input>
+      <ion-input formControlName="password" placeholder="Re-enter Password" type="text" required #passwordreentry></ion-input>
     </ion-item>
 
     <button ion-button full color="primary" style="margin-top: 20px;" 
-    type="submit" [disabled]="!destinationForm.valid" (click)=createDestination()>Add</button>
+    type="submit" [disabled]="!signupForm.valid" (click)=createUser()>Add</button>
   </form>
 </ion-content>

src/pages/signup/signup.ts

@@ -1,5 +1,9 @@
 import { Component } from '@angular/core';
 import { IonicPage, NavController, NavParams } from 'ionic-angular';
+import { SignupService } from '../../services/user-service/signup-service';
+import { FormGroup } from '@angular/forms';
+import { User } from '../../model/user-model';
+import { MapPage } from '../map/map';
 
 /**
  * Generated class for the SignupPage page.
@@ -15,11 +19,23 @@ import { IonicPage, NavController, NavParams } from 'ionic-angular';
 })
 export class SignupPage {
 
-  constructor(public navCtrl: NavController, public navParams: NavParams) {
+  userForm : FormGroup;
+  user : User;
+
+  constructor(public navCtrl: NavController, public navParams: NavParams, public signupService: SignupService) {
   }
 
   ionViewDidLoad() {
     console.log('ionViewDidLoad SignupPage');
   }
 
+  createUser() {
+    this.user = this.userForm.value;
+    this.signupService.createUser(this.user).subscribe(data => this.user = data as User,
+      err => {
+        console.log(err);
+      })
+      this.navCtrl.push(MapPage);
+  }
+
 }

src/services/user-service/signup-service.ts

@@ -0,0 +1,24 @@
+import { Injectable } from "@angular/core";
+import { HttpClient, HttpErrorResponse } from "@angular/common/http"
+import { User } from "../../model/user-model";
+import { Observable } from "rxjs";
+
+@Injectable()
+export class SignupService {
+
+    private destinationUrl = "http://localhost:9090/api/v1/users"
+
+    constructor(protected httpClient: HttpClient) {
+    }
+
+    //CREATE
+    createUser(user: User): Observable<User> {
+      return this.httpClient
+        .post<User>(this.destinationUrl, user)
+        .catch((err: HttpErrorResponse) => {
+          console.error('An error occurred: ', err.error);
+          return Observable.throw(err.statusText);
+        });
+    }
+
+}