get angular services working

9 files changed, 78 insertions, 38 deletions

diff --git a/ufund-ui/src/app/app-routing.module.ts b/ufund-ui/src/app/app-routing.module.ts
index 36e74d3..d4f14da 100644
--- a/ufund-ui/src/app/app-routing.module.ts
+++ b/ufund-ui/src/app/app-routing.module.ts
@@ -1,21 +1,24 @@
-import { NgModule } from '@angular/core';
-import { RouterModule, Routes } from '@angular/router';
+import {NgModule} from '@angular/core';
+import {RouterModule, Routes} from '@angular/router';
 import {CupboardComponent} from './components/cupboard/cupboard.component';
 import {DashboardComponent} from './components/dashboard/dashboard.component';
 import {LoginComponent} from './components/login/login.component';
 import {HomePageComponent} from './components/home-page/home-page.component';
 import {FundingBasketComponent} from './components/funding-basket/funding-basket.component';
+import {NeedPageComponent} from './components/need-page/need-page.component';
 
 const routes: Routes = [
-  {path: '', component: HomePageComponent},
-  {path: 'login', component: LoginComponent},
-  {path: 'cupboard', component: CupboardComponent},
-  {path: 'dashboard', component: DashboardComponent},
-  {path: 'funding-basket', component: FundingBasketComponent},
+    {path: '', component: HomePageComponent},
+    {path: 'login', component: LoginComponent},
+    {path: 'cupboard', component: CupboardComponent},
+    {path: 'dashboard', component: DashboardComponent},
+    {path: 'funding-basket', component: FundingBasketComponent},
+    {path: 'need/:id', component: NeedPageComponent}
 ];
 
 @NgModule({
-  imports: [RouterModule.forRoot(routes)],
-  exports: [RouterModule]
+    imports: [RouterModule.forRoot(routes)],
+    exports: [RouterModule]
 })
-export class AppRoutingModule { }
+export class AppRoutingModule {
+}
diff --git a/ufund-ui/src/app/app.module.ts b/ufund-ui/src/app/app.module.ts
index 95208e1..d818841 100644
--- a/ufund-ui/src/app/app.module.ts
+++ b/ufund-ui/src/app/app.module.ts
@@ -1,28 +1,31 @@
-import { NgModule } from '@angular/core';
-import { BrowserModule } from '@angular/platform-browser';
+import {NgModule} from '@angular/core';
+import {BrowserModule} from '@angular/platform-browser';
 
-import { AppRoutingModule } from './app-routing.module';
-import { AppComponent } from './app.component';
-import { NeedPageComponent } from './components/need-page/need-page.component';
-import { HomePageComponent } from './components/home-page/home-page.component';
-import { FundingBasketComponent } from './components/funding-basket/funding-basket.component';
-import { CupboardComponent } from './components/cupboard/cupboard.component';
-import { NeedListComponent } from './components/need-list/need-list.component';
+import {AppRoutingModule} from './app-routing.module';
+import {AppComponent} from './app.component';
+import {NeedPageComponent} from './components/need-page/need-page.component';
+import {HomePageComponent} from './components/home-page/home-page.component';
+import {FundingBasketComponent} from './components/funding-basket/funding-basket.component';
+import {CupboardComponent} from './components/cupboard/cupboard.component';
+import {NeedListComponent} from './components/need-list/need-list.component';
+import {HttpClientModule} from '@angular/common/http';
 
 @NgModule({
-  declarations: [
-    AppComponent,
-    NeedPageComponent,
-    HomePageComponent,
-    FundingBasketComponent,
-    CupboardComponent,
-    NeedListComponent
-  ],
-  imports: [
-    BrowserModule,
-    AppRoutingModule
-  ],
-  providers: [],
-  bootstrap: [AppComponent]
+    declarations: [
+        AppComponent,
+        NeedPageComponent,
+        HomePageComponent,
+        FundingBasketComponent,
+        CupboardComponent,
+        NeedListComponent
+    ],
+    imports: [
+        BrowserModule,
+        AppRoutingModule,
+        HttpClientModule,
+    ],
+    providers: [],
+    bootstrap: [AppComponent]
 })
-export class AppModule { }
+export class AppModule {
+}
diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.html b/ufund-ui/src/app/components/cupboard/cupboard.component.html
index bcddb33..056c167 100644
--- a/ufund-ui/src/app/components/cupboard/cupboard.component.html
+++ b/ufund-ui/src/app/components/cupboard/cupboard.component.html
@@ -1 +1,2 @@
 <p>cupboard works!</p>
+<app-need-list></app-need-list>
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.html b/ufund-ui/src/app/components/need-list/need-list.component.html
index d366ee6..6e48d96 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.html
+++ b/ufund-ui/src/app/components/need-list/need-list.component.html
@@ -1 +1,6 @@
-<p>need-list works!</p>
+<h1>Needs List</h1>
+<li *ngFor="let need of needs">
+    <a routerLink="/need/{{need.id}}">
+        {{need.name}}
+    </a>
+</li>
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.ts b/ufund-ui/src/app/components/need-list/need-list.component.ts
index 61ed089..a3eb072 100644
--- a/ufund-ui/src/app/components/need-list/need-list.component.ts
+++ b/ufund-ui/src/app/components/need-list/need-list.component.ts
@@ -1,4 +1,6 @@
 import { Component } from '@angular/core';
+import {Need} from '../../models/Need';
+import {CupboardService} from '../../services/cupboard.service';
 
 @Component({
   selector: 'app-need-list',
@@ -7,5 +9,13 @@ import { Component } from '@angular/core';
   styleUrl: './need-list.component.css'
 })
 export class NeedListComponent {
+  needs: Need[] = [];
 
+  constructor(
+    private cupboardService: CupboardService
+  ) {}
+
+  ngOnInit(): void {
+    this.cupboardService.getNeeds().subscribe(n => this.needs = n)
+  }
 }
diff --git a/ufund-ui/src/app/components/need-page/need-page.component.html b/ufund-ui/src/app/components/need-page/need-page.component.html
index ed5b6d8..0bc4746 100644
--- a/ufund-ui/src/app/components/need-page/need-page.component.html
+++ b/ufund-ui/src/app/components/need-page/need-page.component.html
@@ -1 +1,7 @@
-<p>need-page works!</p>
+<h1>Need page</h1>
+<p>id: {{need?.id}}</p>
+<p>name: {{need?.name}}</p>
+<p>filterAttributes: {{need?.filterAttributes}}</p>
+<p>type: {{need?.type}}</p>
+<p>max goal: {{need?.maxGoal}}</p>
+<p>current: {{need?.maxGoal}}</p>
diff --git a/ufund-ui/src/app/components/need-page/need-page.component.ts b/ufund-ui/src/app/components/need-page/need-page.component.ts
index 390bfb6..15c1e87 100644
--- a/ufund-ui/src/app/components/need-page/need-page.component.ts
+++ b/ufund-ui/src/app/components/need-page/need-page.component.ts
@@ -1,5 +1,7 @@
 import {Component, Input} from '@angular/core';
 import {Need} from '../../models/Need';
+import {ActivatedRoute} from "@angular/router";
+import {CupboardService} from "../../services/cupboard.service";
 
 @Component({
   selector: 'app-need-page',
@@ -8,5 +10,15 @@ import {Need} from '../../models/Need';
   styleUrl: './need-page.component.css'
 })
 export class NeedPageComponent {
+  constructor(
+     private route: ActivatedRoute,
+     private cupboardService: CupboardService,
+  ) {}
+
   @Input() need?: Need;
+
+  ngOnInit(): void {
+    const id = Number(this.route.snapshot.paramMap.get('id'));
+    this.cupboardService.getNeed(id).subscribe(n => this.need = n);
+  }
 }
diff --git a/ufund-ui/src/app/services/cupboard.service.ts b/ufund-ui/src/app/services/cupboard.service.ts
index 6e2671a..c123841 100644
--- a/ufund-ui/src/app/services/cupboard.service.ts
+++ b/ufund-ui/src/app/services/cupboard.service.ts
@@ -8,7 +8,7 @@ import {Observable} from 'rxjs';
 })
 export class CupboardService {
 
-    private url = "localhost:8080/cupboard"
+    private url = "http://localhost:8080/cupboard"
     private httpOptions = {
         headers: new HttpHeaders({'Content-Type': 'application/json'})
     };
diff --git a/ufund-ui/src/app/services/users.service.ts b/ufund-ui/src/app/services/users.service.ts
index 65a9e61..1b6dfb6 100644
--- a/ufund-ui/src/app/services/users.service.ts
+++ b/ufund-ui/src/app/services/users.service.ts
@@ -8,7 +8,7 @@ import {User} from '../models/User';
 })
 export class UsersService {
 
-    private url = "localhost:8080/cupboard"
+    private url = "http://localhost:8080/users"
     private httpOptions = {
         headers: new HttpHeaders({'Content-Type': 'application/json'})
     };