In this exercise...

you will practice putting together everything you have learned to display data to the user.

Directions:

In the project linked below:

  1. Display the complete list of watch items.
  2. Fix all display issues by using pipes.
  3. Implement swapping items when the up or down arrow is clicked
  4. Have no up arrow on the first item
  5. Have no down arrow on the last item
  6. Items that are on sale (onSale property set to true) should be indicated using the bg-success class
  7. Set the document title to show the # of items in the watch list
  8. Bonus Challenge - Only show 4 movies and have a "show all" button that disappears after it is clicked.

Click the following link to open up the exercise: https://stackblitz.com/fork/angular-gn3kyo?file=src%2Fapp%2Fwatch-list-item%2Fwatch-list-item.component.html