diff options
| author | Tucker Evans <tuckerevans24@gmail.com> | 2019-12-04 23:00:02 -0500 |
|---|---|---|
| committer | Tucker Evans <tuckerevans24@gmail.com> | 2019-12-08 15:03:07 -0500 |
| commit | 443ded565b1482eaf17176967372f3986497f1b8 (patch) | |
| tree | 01301c9d7c79e0f161263c8a933cebbae7d14f4f /recipeBuddy/src/app/add-recipe/add-recipe.component.html | |
| parent | 651c877315b0669eeb4a3a8447691ae65accf20b (diff) | |
Add basic form for adding a recipe
Diffstat (limited to 'recipeBuddy/src/app/add-recipe/add-recipe.component.html')
| -rw-r--r-- | recipeBuddy/src/app/add-recipe/add-recipe.component.html | 75 |
1 files changed, 74 insertions, 1 deletions
diff --git a/recipeBuddy/src/app/add-recipe/add-recipe.component.html b/recipeBuddy/src/app/add-recipe/add-recipe.component.html index 29e904b..3a42687 100644 --- a/recipeBuddy/src/app/add-recipe/add-recipe.component.html +++ b/recipeBuddy/src/app/add-recipe/add-recipe.component.html @@ -1 +1,74 @@ -<p>add-recipe works!</p> +<form [formGroup]="recipeForm"> + <label> + Name: + <input type="text" formControlName="recipeName"> + </label> + <label> + Description: + <input type="text" formControlName="desc"> + </label> + <label> + Servings: + <input type="text" formControlName="servingSize"> + </label> + <label> + Cooking Time: + <input type="text" formControlName="cookTime"> + </label> + <label> + Keywords/Tags: + <input type="text" formControlName="tags"> + </label> + <label> + Photos (URLS): + <input type="text" formControlName="photos"> + </label> + + <div formArrayName="ingredients"> + <h3>Ingredients</h3> + <button (click)="addIngredient()">Add Ingredient</button> + <div *ngFor="let address of ingredients.controls; let i=index"> + <div [formGroupName]="i"> + <h4>Ingredient {{ i + 1 }}</h4> + <label> + Name: + <input type="text" + formControlName="ingrName"> + </label> + <label> + Amount: + <input type="text" + formControlName="amount"> + </label> + <label> + Name: + <input type="text" + formControlName="units"> + </label> + </div> + </div> + </div> + + <div formArrayName="steps"> + <h3>Steps</h3> + <button (click)="addStep()">Add Step</button> + <div *ngFor="let address of steps.controls; let i=index"> + <div [formGroupName]="i"> + <h4>Step {{ i + 1 }}</h4> + <label> + Instructions: + <input type="text" + formControlName="instruct"> + </label> + <label> + Timer: + <input type="text" + formControlName="timer"> + </label> + </div> + </div> + </div> +</form> +<p> +Value: {{ recipeForm.value | json }} +</p> |