We don't need to do much in our component. Of course, we need to add some things in the template to support adding a product. In terms of NgRx, we just need to dispatch the ADD_PRODUCT action. Let's have a look at the code:
import { Component, OnInit } from "@angular/core";import { AppState } from "../app-state";import { Store } from "@ngrx/store";import { fetchProducts, addProduct } from "./product.actions";import { getList, isLoading, getError } from "./products.selectors";@Component({selector: "products", template: ` <div> <input [(ngModel)]="newProduct" placeholder="new product..." /> <button (click)="addNewProduct()"></button> </div> <div *ngFor="let product of products$ | async"> Product: {{ product.name ...
