Angular $11\mathrm{.}2\mathrm{.}3$ Typescript

Your task is to implement two components that communicate with each other through the parent component:

Requirements

$1.$ Implement a ValueProviderComponent that:

consist of an input text field $()$

$$ emits values provided in the input field using an EventEmitter object called typedValue.

$2.$ Implement a ValueReceiverComponent that

$$ accepts input values as a printvalue parameter $([$printValue$]=$"somevalue"$)$;

prints printValue value in the template.

$3.$ Implement an AppComponent that

contains ValueProviderComponent and ValueReceiver Component:

handles values emitted by the ValueProviderComponent and passes them as input to the ValueReceiverComponent

Before you start

The initial solution provides you with a three$-$component skeleton. Your task is to implement their templates and logic

You can use console.log for debugging purposes. Tests are not verifying if the console is clear.

Environment

The task should be completed using the following software$/$library versions:

$$ Angular $11\mathrm{.}2\mathrm{.}3$

TypeScript $4\mathrm{.}12$

Node $15\mathrm{.}10\mathrm{.}0$