Modifying forms dynamically

So far, we have used the FormGroup and FormControl classes extensively throughout this chapter. However, we have not seen what FormArray is all about. Consider the scenario where we have added some products to the shopping cart of our e-shop application and want to update their quantities before checking out the order.

Currently, our application does not have any functionality for a shopping cart, so we will now add one:

1. Create a new service to manage the shopping cart by running the following Angular CLI command in the src\app\cart folder:

ng generate service cart

1. Open the cart.service.ts file and add the following import statement:

import { Product } from '../products/product';

1. Create a cart property in the CartService class and initialize it to an empty array:

export class CartService {
  cart: Product[] = [];
  constructor() { }
}

The preceding cart property will be an intermediate local...