From 3409bdb8581a6d4177ba3751c756bda245e003dc Mon Sep 17 00:00:00 2001 From: francesco Date: Mon, 13 Dec 2021 22:57:08 +0100 Subject: [PATCH] finish Project basic --- project/src/app/app.component.html | 4 +- project/src/app/app.module.ts | 6 --- project/src/app/header/header.component.html | 23 +++++++++++- .../recipe-detail.component.html | 37 ++++++++++++++++++- .../recipe-detail/recipe-detail.component.ts | 2 +- .../recipe-item/recipe-item.component.html | 4 +- .../recipe-item/recipe-item.component.ts | 2 +- .../recipe-list/recipe-list.component.html | 29 ++++++++++++++- .../recipe-list/recipe-list.component.ts | 8 +++- project/src/app/recipes/recipe.model.ts | 11 ++++++ .../src/app/recipes/recipes.component.html | 9 ++++- project/src/app/recipes/recipes.component.ts | 2 +- project/src/app/shared/ingredient.model.ts | 4 ++ .../shopping-edit.component.html | 24 +++++++++++- .../shopping-edit/shopping-edit.component.ts | 2 +- .../shopping-list.component.html | 16 +++++++- .../shopping-list/shopping-list.component.ts | 8 +++- 17 files changed, 171 insertions(+), 20 deletions(-) create mode 100644 project/src/app/recipes/recipe.model.ts create mode 100644 project/src/app/shared/ingredient.model.ts diff --git a/project/src/app/app.component.html b/project/src/app/app.component.html index 42e76df..e6bcc99 100644 --- a/project/src/app/app.component.html +++ b/project/src/app/app.component.html @@ -1,7 +1,9 @@ +
-

I'm working!

+ +
\ No newline at end of file diff --git a/project/src/app/app.module.ts b/project/src/app/app.module.ts index cc3a2d4..6685335 100644 --- a/project/src/app/app.module.ts +++ b/project/src/app/app.module.ts @@ -4,9 +4,6 @@ import { BrowserModule } from '@angular/platform-browser'; import { AppComponent } from './app.component'; import { HeaderComponent } from './header/header.component'; import { RecipesComponent } from './recipes/recipes.component'; -import { RecipesListComponent } from './recipes/recipes-list/recipes-list.component'; -import { RecipesDetailComponent } from './recipes/recipes-detail/recipes-detail.component'; -import { RecipesItemComponent } from './recipes/recipe-list/recipes-item/recipes-item.component'; import { RecipeListComponent } from './recipes/recipe-list/recipe-list.component'; import { RecipeDetailComponent } from './recipes/recipe-detail/recipe-detail.component'; import { RecipeItemComponent } from './recipes/recipe-list/recipe-item/recipe-item.component'; @@ -18,9 +15,6 @@ import { ShoppingEditComponent } from './shopping-list/shopping-edit/shopping-ed AppComponent, HeaderComponent, RecipesComponent, - RecipesListComponent, - RecipesDetailComponent, - RecipesItemComponent, RecipeListComponent, RecipeDetailComponent, RecipeItemComponent, diff --git a/project/src/app/header/header.component.html b/project/src/app/header/header.component.html index 4f5a95d..bf6adff 100644 --- a/project/src/app/header/header.component.html +++ b/project/src/app/header/header.component.html @@ -1 +1,22 @@ -

header works!

+ \ No newline at end of file diff --git a/project/src/app/recipes/recipe-detail/recipe-detail.component.html b/project/src/app/recipes/recipe-detail/recipe-detail.component.html index 75833e3..9af1626 100644 --- a/project/src/app/recipes/recipe-detail/recipe-detail.component.html +++ b/project/src/app/recipes/recipe-detail/recipe-detail.component.html @@ -1 +1,36 @@ -

recipe-detail works!

+
+
+ +
+
+
+
+

Recipe Name

+
+
+
+
+
+ + +
+
+
+
+
+ Description +
+
+
+
+ Ingredients +
+
diff --git a/project/src/app/recipes/recipe-detail/recipe-detail.component.ts b/project/src/app/recipes/recipe-detail/recipe-detail.component.ts index 809dd71..87cba8f 100644 --- a/project/src/app/recipes/recipe-detail/recipe-detail.component.ts +++ b/project/src/app/recipes/recipe-detail/recipe-detail.component.ts @@ -9,7 +9,7 @@ export class RecipeDetailComponent implements OnInit { constructor() { } - ngOnInit(): void { + ngOnInit() { } } diff --git a/project/src/app/recipes/recipe-list/recipe-item/recipe-item.component.html b/project/src/app/recipes/recipe-list/recipe-item/recipe-item.component.html index c02c9ba..e819b71 100644 --- a/project/src/app/recipes/recipe-list/recipe-item/recipe-item.component.html +++ b/project/src/app/recipes/recipe-list/recipe-item/recipe-item.component.html @@ -1 +1,3 @@ -

recipe-item works!

+

+ recipe-item works! +

diff --git a/project/src/app/recipes/recipe-list/recipe-item/recipe-item.component.ts b/project/src/app/recipes/recipe-list/recipe-item/recipe-item.component.ts index 8b8e561..6da52d7 100644 --- a/project/src/app/recipes/recipe-list/recipe-item/recipe-item.component.ts +++ b/project/src/app/recipes/recipe-list/recipe-item/recipe-item.component.ts @@ -9,7 +9,7 @@ export class RecipeItemComponent implements OnInit { constructor() { } - ngOnInit(): void { + ngOnInit() { } } diff --git a/project/src/app/recipes/recipe-list/recipe-list.component.html b/project/src/app/recipes/recipe-list/recipe-list.component.html index ac36a67..33796fa 100644 --- a/project/src/app/recipes/recipe-list/recipe-list.component.html +++ b/project/src/app/recipes/recipe-list/recipe-list.component.html @@ -1 +1,28 @@ -

recipe-list works!

+
+
+ +
+
+
+
+
+ +
+

{{ recipe.name }}

+

{{ recipe.description }}

+
+ + {{ recipe.name }} + + + +
+
+ diff --git a/project/src/app/recipes/recipe-list/recipe-list.component.ts b/project/src/app/recipes/recipe-list/recipe-list.component.ts index 1394069..9ff59dc 100644 --- a/project/src/app/recipes/recipe-list/recipe-list.component.ts +++ b/project/src/app/recipes/recipe-list/recipe-list.component.ts @@ -1,15 +1,21 @@ import { Component, OnInit } from '@angular/core'; +import { Recipe } from '../recipe.model'; + @Component({ selector: 'app-recipe-list', templateUrl: './recipe-list.component.html', styleUrls: ['./recipe-list.component.css'] }) export class RecipeListComponent implements OnInit { + recipes: Recipe[] = [ + new Recipe('A Test Recipe', 'This is simply a test', 'https://upload.wikimedia.org/wikipedia/commons/1/15/Recipe_logo.jpeg'), + new Recipe('A Test Recipe', 'This is simply a test', 'https://upload.wikimedia.org/wikipedia/commons/1/15/Recipe_logo.jpeg') + ]; constructor() { } - ngOnInit(): void { + ngOnInit() { } } diff --git a/project/src/app/recipes/recipe.model.ts b/project/src/app/recipes/recipe.model.ts new file mode 100644 index 0000000..f38ed4a --- /dev/null +++ b/project/src/app/recipes/recipe.model.ts @@ -0,0 +1,11 @@ +export class Recipe { + public name: string; + public description: string; + public imagePath: string; + + constructor(name: string, desc: string, imagePath: string) { + this.name = name; + this.description = desc; + this.imagePath = imagePath; + } +} diff --git a/project/src/app/recipes/recipes.component.html b/project/src/app/recipes/recipes.component.html index 029d6ef..10369a3 100644 --- a/project/src/app/recipes/recipes.component.html +++ b/project/src/app/recipes/recipes.component.html @@ -1 +1,8 @@ -

recipes works!

+
+
+ +
+
+ +
+
diff --git a/project/src/app/recipes/recipes.component.ts b/project/src/app/recipes/recipes.component.ts index 4e4595c..c60423c 100644 --- a/project/src/app/recipes/recipes.component.ts +++ b/project/src/app/recipes/recipes.component.ts @@ -9,7 +9,7 @@ export class RecipesComponent implements OnInit { constructor() { } - ngOnInit(): void { + ngOnInit() { } } diff --git a/project/src/app/shared/ingredient.model.ts b/project/src/app/shared/ingredient.model.ts new file mode 100644 index 0000000..aed99af --- /dev/null +++ b/project/src/app/shared/ingredient.model.ts @@ -0,0 +1,4 @@ +export class Ingredient { + // short form that sets the property and asign the value to them + constructor(public name: string, public amount: number) {} +} \ No newline at end of file diff --git a/project/src/app/shopping-list/shopping-edit/shopping-edit.component.html b/project/src/app/shopping-list/shopping-edit/shopping-edit.component.html index c98d6a9..be6aeb9 100644 --- a/project/src/app/shopping-list/shopping-edit/shopping-edit.component.html +++ b/project/src/app/shopping-list/shopping-edit/shopping-edit.component.html @@ -1 +1,23 @@ -

shopping-edit works!

+
+
+
+
+
+ + +
+
+ + +
+
+
+
+ + + +
+
+
+
+
diff --git a/project/src/app/shopping-list/shopping-edit/shopping-edit.component.ts b/project/src/app/shopping-list/shopping-edit/shopping-edit.component.ts index e0bf0b8..19edfff 100644 --- a/project/src/app/shopping-list/shopping-edit/shopping-edit.component.ts +++ b/project/src/app/shopping-list/shopping-edit/shopping-edit.component.ts @@ -9,7 +9,7 @@ export class ShoppingEditComponent implements OnInit { constructor() { } - ngOnInit(): void { + ngOnInit() { } } diff --git a/project/src/app/shopping-list/shopping-list.component.html b/project/src/app/shopping-list/shopping-list.component.html index 449f456..87188f1 100644 --- a/project/src/app/shopping-list/shopping-list.component.html +++ b/project/src/app/shopping-list/shopping-list.component.html @@ -1 +1,15 @@ -

shopping-list works!

+
+
+ +
+ +
+
diff --git a/project/src/app/shopping-list/shopping-list.component.ts b/project/src/app/shopping-list/shopping-list.component.ts index 991add0..ceed603 100644 --- a/project/src/app/shopping-list/shopping-list.component.ts +++ b/project/src/app/shopping-list/shopping-list.component.ts @@ -1,15 +1,21 @@ import { Component, OnInit } from '@angular/core'; +import { Ingredient } from '../shared/ingredient.model'; + @Component({ selector: 'app-shopping-list', templateUrl: './shopping-list.component.html', styleUrls: ['./shopping-list.component.css'] }) export class ShoppingListComponent implements OnInit { + ingredients: Ingredient[] = [ + new Ingredient('Apples', 5), + new Ingredient('Tomatoes', 10), + ]; constructor() { } - ngOnInit(): void { + ngOnInit() { } }