blob: a4e87abd32f06ee3fba8ec058162c75fe63a8295 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
|
<div class="row">
<div class="column">
<h1> Recipes </h1>
<mat-selection-list #rlist>
<mat-list-option *ngFor="let recipe of recipes" [value]="recipe">
{{recipe.name}}
</mat-list-option>
</mat-selection-list>
</div>
<div class="column">
<h1> Ingredients </h1>
<div *ngFor="let selectedRecipe of rlist.selectedOptions.selected">
<h3>{{selectedRecipe.value.name}}</h3>
<mat-selection-list #ilist>
<mat-list-option *ngFor="let ing of selectedRecipe.value.ingredients" [value]="ing" (click)="addIngredient(ing)">
{{ing.name}} {{ing.amount}} {{ing.unit}}
</mat-list-option>
</mat-selection-list>
</div>
</div>
<div class="column">
<h1> Shopping List </h1>
<mat-list #clist *ngFor="let cartItem of ingredients">
<mat-list-item>{{cartItem.name}} {{cartItem.amount}} {{cartItem.unit}}</mat-list-item>
<mat-divider></mat-divider>
</mat-list>
</div>
</div>
|