check this image for visualization
I am using Angular v17.
I am fetching products information using APIs. The products are fetched in the product-list-component using the fetch-all-products-service. Then I am checking if the value of 'category' is set in the filter-form-service. If so, then the component is using the API that fetches all products but if 'category' exists then filter the products of that category.
When the form in filter-form-template is submitted, the value of 'category' is set using the setCategoryValue() method of filter-form-service.
Now, I want to render the product-list-component each time the form is submitted. how to do this?
*See the image for clear visualization