Book
Submodule 20.2: Data Binding - Practice
Submodule 20.2: Data Binding - Practice
Completion requirements
View
Updating the .html files
Open menu.component.html and update the class media with the Event binding (click) = "onSelect(dish)". So, when Choco-dish is clicked, the onSelect(dish: Dish) method is called and passes the value of the Choco-dish that has been clicked in the menu.component.ts.
<div class="media" *ngFor="let dish of dishes" (click) = "onSelect(dish)">
Modify the dishdetail link using the Property binding [dish] = "selectedDish". With this property binding, the value- dish is passed from the component to the specified property- selectDish. Recall that the selectedDish is a variable in the menu.component.ts file.
<app-dishdetail [dish] = "selectedDish"></app-dishdetail>